Javascript angularjs选择绑定变量更改时不更新

好的，我有一个select标记绑定到控制器的范围变量。当应用程序初始化时，变量为空，因此选择列表生成一个项目-空项目

在run函数中，列表被初始化，事件被广播。控制器获取广播并用98个值更新变量。但是，select标记似乎无法更新

我做错了什么

HTML:

---

我跟踪了代码，确实看到范围变量data.srcList得到了更新。

因此，我不确定如何从module.run方法发出事件，因为听起来这就是您所说的

在不了解您的应用程序的情况下，我制作了一个JSFIDLE，它似乎工作得很好。我可能误解了您的问题，但如果不是，您应该能够与这个JSFIDLE进行比较来解决它

html代码

<div id="apphost">
     <select id='srcList' size='10' data-ng-model="data.source" data-ng-options="s.title for s in data.srcList"></select>
     <br> </div>

我认为问题在于我访问的indexedDB函数是异步的，需要$apply（）调用

你有没有在chrome开发工具中查看select的AngularJS属性（Batarang）？使用它可以从select（Inspect元素）的角度查看您的作用域。我不知道batarang，但我加载了它并发现了—当我单击select时，select列表将填充。不知道这告诉我什么！添加$scope.$apply（）；在每个$on函数调用结束时，似乎都“修复”了这个问题。我不确定我是否理解为什么thoughI不能用你发布的代码真正识别问题，但我下面有一个示例可能会有所帮助。很有趣。您不需要调用$scope.$apply（），因为这应该在$on的末尾自动发生……我认为问题在于我正在访问异步的indexedDB函数，需要调用$apply（）

.controller('rightSidebar', function($scope, dataProvider) {
    $scope.data = {};
    $scope.data.srcList = dataProvider.srcList;
    $scope.data.citeList = dataProvider.citeList;

    $scope.$on('SrcListRefresh', function () {
        $scope.data.srcList = dataProvider.srcList;
    });

    $scope.$on('CiteListRefresh', function () {
        $scope.data.citeList = dataProvider.citeList;
    });
});

function rightSidebar($scope, dataProvider) {
    $scope.data = {};
    $scope.data.srcList = dataProvider.srcList;
    $scope.data.citeList = dataProvider.citeList;

    $scope.$on('SrcListRefresh', function () {
        alert("Controller Scope Level - Handler SrcListRefresh");
        $scope.data.srcList = dataProvider.srcList;
    });

    $scope.$on('CiteListRefresh', function () {
        $scope.data.citeList = dataProvider.citeList;
    });
}

var myapp = angular.module("app", [], function ($routeProvider, $locationProvider) {});

myapp.run(function ($rootScope) {
    $rootScope.data = {
        srcList: null,
        citeList: null
    };

    //setTimeout the non angular way
    setTimeout(function () {
        $rootScope.$apply(function () {
            $rootScope.data.srcList = [{
                title: 'A'
            }, {
                title: 'B'
            }, {
                title: 'C'
            }];
        });

    }, 1000);

});

angular.element("#apphost").ready(function () {
    angular.bootstrap("#apphost", ['app']);
});

<div id="apphost">
     <select id='srcList' size='10' data-ng-model="data.source" data-ng-options="s.title for s in data.srcList"></select>
     <br> </div>