Question

我有一个运行angularJS的页面。有时，当我打开文档时，有时只显示需要显示的数据。当我不断尝试刷新页面时，它几乎是随机的：有时会出现内容，有时它不会。

运行此代码的代码部分如下所示：

                <div class="row">
                    <div class="col-md-12" ng-repeat="(observer,hosts2) in bugDuration">
                        {{observer}}
                        <div class="row">
                            <div class="col-md-3" ng-repeat="(host, bugs2) in hosts2"> {{host}} 
                                <div ng-repeat="(bug, duration) in bugs2">
                                    {{bug}} for {{duration}} seconds.
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

正如您所看到的，它正在使用ng-repeat，我最好的猜测是，当此代码运行时，ng-repeat对象（例如bugDuration）为空，因此它们都不会运行。

初始化所有这些变量的脚本位于我的文档之后。我是否应该在控制器中执行某些操作，以便可以刷新变量并且每次都可以显示内容？

修改

以下是初始化bugDuration的代码：

 bugDuration = {};
                    bugTracker = {};

                    $.getJSON('../java_output/bugs.json', function (data) {
                        for ( var observer in data ) {
                            bugDuration[observer] = {};
                            for (var host in data[observer]) {
                                bugDuration[observer][host] = {};
                                for (var bug in data[observer][host]) {
                                    bugDuration[observer][host][bug] = data[observer][host][bug].duration;    
                                }
                            }
                        }

                        console.log (bugDuration);
                    });


                    $.getJSON('../java_output/bug_summary.json', function (data) {
                        var numObservers = data.numObservers;
                        delete data['numObservers'];
                        JSONbugsList = data;
                        var bugTracker = {};
                        for (var observer = 1; observer <= numObservers; observer++) {
                            observers.push(observer);
                            observerKeys = Object.keys(data);
                            // observerKeys.splice(observerKeys.indexOf('numObservers'));
                            for (var host in data["observer" + observer]) {
                                if (hosts.indexOf(host) == -1) {
                                    hosts.push(host);
                                }
                                hostKeys = Object.keys(data["observer" + observer]);
                                for (var bug in data["observer" + observer][host]) {
                                    if (bugs.indexOf(bug) == -1) {
                                        bugs.push(bug);  
                                    }
                                    for (var i in  data["observer" + observer][host][bug]) { 
                                        bugTracker[bug] = true;
                                        var dateVar = data["observer" + observer][host][bug][i];
                                        var intoList = {"observer":observer, "host":host, "bug":bug, "start":(new Date(1000*dateVar.start)), "end":(dateVar.end==null?' the end.':(new Date(1000*dateVar.end)))} 
                                        }
                                }
                            }
                        }



                       // Removed unimportant stuff here//



                        $scope.$apply();
                        $scope.hostsS = hosts;
                        $scope.bugsS = bugs;
                        $scope.observersS = observers;
                        $scope.JSONbugsList = JSONbugsList;
                        $scope.hostKeys = hostKeys;
                        $scope.observerKeys = observerKeys; 
                        $scope.start = 'start';
                        $scope.end = 'end';
                        $scope.bugDuration = bugDuration;
                        $scope.$apply();

Answer 1

其中最大的问题是$scope.$apply()需要在$scope上设置数据后发生$scope.$apply()。由于$ .getJSON是异步的，因此在触发回调时，底部的$.getJSON('../java_output/bug_summary.json', function (data) { /*do stuff outside of angular context when the ASYNC callback fires*/ $scope.stuff = data; /*then call $scope.$apply()*/ $scope.$apply(); });行将被触发。

{{1}}

当我不断刷新angularJS页面时，内容有时会显示，有时则不会

1 个答案: