angularjs - AngularStrap bs-select 不更新 ng-model

Question

我正在使用 AngularStraps bs-select 指令将多项选择按钮添加到我的 View 之一。我试图观察此选择框中的值，并在值发生变化时运行搜索。

我的选择按钮如下所示。

<button type="button" class="btn btn-primary" ng-model="subject_list" data-multiple="1"
  data-placeholder="All subjects" ng-options="subject.id as subject.name for subject in subjects" bs-select>
  Action <span class="caret"></span>
</button>

问题是 $scope.subject_list 永远不会被填充。选择似乎工作正常，用户界面看起来也不错，但 ng-model 永远不会填充任何东西。

在我的 Controller 中，我将 $scope.subject_list 初始化为一个空数组，然后使用 $watch 函数检查它何时发生变化。没有什么会被解雇。我什至写了一个小函数来每秒打印出 $scope.subject_list 的值，但它总是空的。

$scope.subject_list = [];
$scope.$watch('subject_list', $scope.update_search);
$scope.update_search = function(){
  console.log($scope.subject_list);
};

对于发生的事情有什么想法吗？我曾经有过这个工作，所以我要么做了一些愚蠢的事情，要么最近的更新破坏了事情。

更新

这似乎是一个范围继承问题。我有各种各样的范围，这可能是问题的一部分。不过，我可以通过在 rootScope 上执行所有操作来实现此功能。所以...

<button type="button" class="btn btn-primary" ng-model="$root.subject_list" data-multiple="1"
  data-placeholder="All subjects" ng-options="subject.id as subject.name for subject in subjects" bs-select>
  Action <span class="caret"></span>
</button>

和

$rootScope.subject_list = [];
$rootScope.$watch('subject_list', function(){
    console.log('change');
});

我确信这不是最好的方法，但我无法弄清楚我的范围出了什么问题。

Answer 1

这里的问题归结为范围界定问题。我使用 ui.router 和 $stateProvider 以及许多嵌套状态和 View 。

我有一个抽象状态，我将 Controller 设置为所有子状态。

.state('profiles.search',{
    url: '/search',
    abstract: true,
    template: '<ui-view/>',
    controller: 'SearchCtrl'
  })

  .state('profiles.search.classrooms', {
    url: '/classrooms',
    templateUrl: 'views/classrooms/search.html',
    data: {
      update_classrooms: true
    }
  })

我没有意识到的是，当呈现“profiles.search.classroom”状态的 templateUrl 时，它会获得自己的范围，该范围继承自“profiles.search”范围，其中我的所有作用域变量位于 SearchCtrl 中。

因此，我可以从 SearchCtrl 初始化数据，但它不会从 View 绑定(bind)回来，因为它是它自己的范围。

这个故事的寓意是，确保您知道自己正在工作的范围。