1

我正在使用Select2和AngularJS,我想更改与控制器中选择框关联的ng模型。目前在我的plunkr示例中,每当我更新ng模型时,select2框都会清除,就像我将ng模型重置为空数组一样。我如何设置它,以便我可以先添加一个人,然后在控制器中启动一个功能,将更多选择添加到选择框中,然后在框中查看原始选择和新选择?更改控制器中的作用域变量不会更改视图中的变量

Plunkr

JS控制器

app.controller('DemoCtrl', function($scope, $http, $timeout) { 
    $scope.addSomePeeps = function() { 
    var peeps = angular.copy($scope.multipleDemo.selectedPeople) 

    $scope.multipleDemo.selectedPeople = peeps.concat([{ name: 'Nicolás', email: '[email protected]', age: 43, country: 'Colombia' }]); 
    }; 

    $scope.person = {}; 
    $scope.people = [ 
    { name: 'Adam',  email: '[email protected]',  age: 12, country: 'United States' }, 
    { name: 'Amalie', email: '[email protected]', age: 12, country: 'Argentina' }, 
    { name: 'Estefanía', email: '[email protected]', age: 21, country: 'Argentina' }, 
    { name: 'Adrian', email: '[email protected]', age: 21, country: 'Ecuador' }, 
    { name: 'Wladimir', email: '[email protected]', age: 30, country: 'Ecuador' }, 
    { name: 'Samantha', email: '[email protected]', age: 30, country: 'United States' }, 
    { name: 'Nicole', email: '[email protected]', age: 43, country: 'Colombia' }, 
    { name: 'Natasha', email: '[email protected]', age: 54, country: 'Ecuador' }, 
    { name: 'Michael', email: '[email protected]', age: 15, country: 'Colombia' }, 
    { name: 'Nicolás', email: '[email protected]', age: 43, country: 'Colombia' } 
    ]; 

    $scope.multipleDemo = {}; 
    $scope.multipleDemo.selectedPeople = [$scope.people[5], $scope.people[4]]; 

}); 

HTML

<body ng-controller="DemoCtrl"> 

    <h3>Array of objects</h3> 
    <ui-select multiple ng-model="multipleDemo.selectedPeople" theme="select2" ng-disabled="disabled" style="width: 800px;"> 
    <ui-select-match placeholder="Select person...">{{$item.name}} &lt;{{$item.email}}&gt;</ui-select-match> 
    <ui-select-choices repeat="person in people | propsFilter: {name: $select.search, age: $select.search}"> 
     <div ng-bind-html="person.name | highlight: $select.search"></div> 
     <small> 
     email: {{person.email}} 
     age: <span ng-bind-html="''+person.age | highlight: $select.search"></span> 
     </small> 
    </ui-select-choices> 
    </ui-select> 
    <p>Selected: {{multipleDemo.selectedPeople}}</p> 

    <button ng-click="addSomePeeps()">Click me to add some specific peeps</button> 

</body> 

回答

0
$scope.$watch('multipleDemo',function(newValue,oldValue){ 
       console.log("WATCH IN PROGRESS: "+newValue+" "+ oldValue); 
      }); 

这种固定我的。我认为watch函数调用$ scope。$ apply来绑定新的值。我尝试使用$范围。$应用哪些工作,但它抛出了一个错误。

希望可以帮到