双向数据绑定在为选择二AngularJS不起作用 [英] Two way databinding in Select2 for AngularJS doesn't work
问题描述
我有在AngularJS使用选择二插件的问题。我可以加载的项目精细化,检索我的NG-模型所选的项目,但我有问题,如果我更新NG-模式下拉不会被更新。
I am having issues with using the Select2 plugin in AngularJS. I can load the items fine, and retrieve the selected item from my ng-model, but I have issues, that the dropdown isn't updated if I update the ng-model.
在我看来,code是这样的:
In my view the code looks like this:
<select ui-select2 data-placeholder="All" id="filtersSelect" ng-model="chosenFilterItem" ng-options="item.text for item in filterItems">
在我的控制器,我有以下code,以检索项目,并将其绑定到列表:
In my controller I have the following code, which retrieves the items and binds it to the list:
$scope.fetchFilters = function(){
$http.get($scope.filtersUrl).then(function(result){
$scope.filterItems = result.data;
$scope.chosenFilterItem = result.data[3];
if(!$scope.$$phase) {
$scope.$apply();
}
});
}
正如你可以看到我只是尝试设置DropDownList的第3项,但没有产品preselected。有没有解决$ P $另一种方式pselecting下拉项目?
As you can see I just try to set the 3rd item on the dropdownlist, but no item is preselected. Is there another way around preselecting a dropdown item?
推荐答案
<一个href=\"https://github.com/angular-ui/ui-select2#working-with-dynamic-options\">Angular-ui/ui-select2 GitHub的页面状态:
Angular-ui/ui-select2 github page states:
UI-SELECT2与&LT不相适应;选择NG-选项&gt;
。为了获得最佳的
结果使用&LT;选项NG重复方式&gt;
而不是
ui-select2 is incompatible with
<select ng-options>
. For the best results use<option ng-repeat>
instead.
所以,为了保存自己头痛我也推荐使用带有NG-重复选项为:
So, to save yourself from headache I also recommend using options with ng-repeat as in:
$scope.filterItems = [
{id: 1, text: 'Item1'},
{id: 2, text: 'Item2'},
{id: 3, text: 'Item3'},
{id: 4, text: 'Item4'}
];
<select ui-select2 placeholder="All" ng-model="chosenItem">
<option value=""></option>
<option ng-repeat="item in filterItems" value="{{item.id}}">{{item.text}}</option>
</select>
这篇关于双向数据绑定在为选择二AngularJS不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!