Question

我正在使用angularjs使用服务动态地将选项添加到选择列表。

app.service('myService',function() {
var dropdown = [{id:1,name:'one'},{id:2,name:'two'}];
this.getDropdown = function(){
  return dropdown;
};
this.add = function(id,name) {      
      dropdown.unshift({id:id,name:name});      
    };
});

在控制器中我正在使用服务绑定下拉模型。

$scope.myDropdown = myService.getDropdown();

现在，当我通过myService.add（id，name）函数在下拉列表中动态添加新项时，它将被添加到列表的开头。我希望新添加的项目一旦添加就被选中。请指导我这样做。

Answer 1

根据ngModel和ngOptions的设置方式，您必须在将ngModel添加到选择（简短样本）之后设置<{1}}

<select ng-model="mySelect" ng-options="o.id as o.name for o in myDropdown"></select>

控制器：

$scope.myDropdown = myService.getDropdown();
dropdown.add(3, "Justin"); //Add to the select
$scope.myDropdown = myService.getDropdown(); //Rebind (not sure if this is needed or not)
$scope.mySelect = $scope.myDropdown[$scope.myDropdown.length - 1].id;

您可以在服务上使用$watch并检查收集长度：

$scope.$watch("myService.getDropdown()", function() {
    return value;
}, function(value) {
    if (value.length != $scope.myDropdown.length) {
        $scope.myDropdown = value;
        $scope.mySelect = $scope.myDropdown[$scope.myDropdown.length - 1].id;
    }
});

更改angularjs服务的下拉列表的选定值

1 个答案: