更新

Question

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

我的选择按钮如下所示。

<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永远不会被填充。选择似乎工作正常，并且ui看起来都很好，但ng-model永远不会被任何东西填充。

在我的控制器中，我将$ 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。

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

.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
    }
  })

我没有意识到的是，当模板用于＆＃39; profiles.search.classroom＆＃39;状态被渲染，它有自己的范围，继承自＆＃39; profiles.search＆＃39;范围，我的所有范围变量都存在于SearchCtrl中。

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

故事的道德，确保你知道你在哪个范围工作。

Answer 2

我在页面上的bs-select之一上也遇到了这个问题，但另一个问题却没有。事实证明，如果您将ng-model分配给范围内对象上的属性，则可以正常工作。即：

ng-model="props.selecteditem"

当

$scope.props = {
    selecteditem: ''
}

这个技巧。

AngularStrap bs-select不更新ng-model

更新

2 个答案: