angularjs - ui-select: set value from controller -
i have 2 ui-select: first allows set category of food (e.g. meat, vegetable, dessert); second allows pick food list of foods. when inserting new food, 1 fills fields, including category (via ui-select). html:
<ui-select ng-model="newfood.category" theme="bootstrap"> <ui-select-match placeholder="select food category"> <span ng-bind="$select.selected.name"></span> </ui-select-match> <ui-select-choices repeat="category in (foodcategories | filter: $select.search)"> <span ng-bind="category.name"></span> </ui-select-choices> </ui-select>
when 1 wants edit existing food, use second ui-select pick food , first select category value. html:
<ui-select ng-model="foodtoeditorremove.selected" theme="bootstrap" on-select="fillformfields()"> <ui-select-match placeholder="select food edit or remove"> <span ng-bind="$select.selected.name"></span> </ui-select-match> <ui-select-choices repeat="food in (foods | filter: $select.search)"> <span ng-bind="food.name"></span> </ui-select-choices> </ui-select>
in controller, after picking category ui-select, $scope.newfood
contains correct values type in, including category. after picking food other ui-select, fillformfields invoked:
$scope.fillformfields = function () { $scope.newfood.name = $scope.foodtoeditorremove.selected.name; $scope.newfood.category = $scope.foodtoeditorremove.selected.category; };
after code, newfood has correct category set , see food name in corresponding input, ui-select not display value. how can update view bind new value?
Comments
Post a Comment