范围更改时如何让 ng-select 更新？

Question

我在表单上方有一个表，即选择一行时，它会填充具有数据的表单。该表单有一个选择元素。选择表中的第一行后，数据会正确填充并显示正确的选择选项。在第二次和随后的选择中，未显示正确选择的选项。在 chrome 开发工具中，我可以看到值正确更新，但没有直观显示。

我错过了什么？如何以视觉方式显示正确的选项？

<select name="updateCategory" ng-model="selectedPermission.permission.category_id">
       <option value="{{cat.id}}" ng-selected="cat.selected" ng-repeat="cat in selectedPermission.permission_categories">
              {{cat.name}}
       </option>
</select>

这是控制器中正在更新范围的函数。

         $rootScope.$watch('toolBarSelectedValue',function(){
            if($rootScope.toolBarSelectedValue >0){
                Permissions.getItem($rootScope.toolBarSelectedValue).then(function(res){
                    var pc = res.data.permission_categories;
                    var p = res.data.permission;
                    angular.forEach(pc,function(v,k){
                        if(v.id == p.category_id){
                            pc[k].selected = true;
                        }else{
                            pc[k].selected = false;
                        }
                    });
                    $scope.selectedPermission = {"permission":p,"permission_categories":pc};
                    $scope.$apply();
                });
            }else if($rootScope.toolBarSelectedValue == 0 || $rootScope.toolBarSelectedValue == null){
                $scope.selectedPermission = {};
            }
        });

Answer 1

我会使用 ng-options 而不是 <option...></option>，然后您可以轻松地将您的选择与您的 ng-model 关联起来。请参阅docs 了解更多信息。

类似：

<select name="updateCategory" ng-model="cat" ng-options="cat.id as cat.name for cat in selectedPermission.permission_categories">
</select>

请记住，我不确定您的数据结构，但这应该可以帮助您。