AngularJS 加载内容后开始观看

Question

我是 AngularJS 的新手。
尝试创建第一个应用程序，但遇到问题。
有复选框列表

<div class='order-box row-fluid' ng-repeat="order in orders" ng-model="orders">
   <input type="checkbox" value="{{ order.id }}" ng-model="order.selected">
<div>

订单是通过加载页面上的 ajax 查询从服务器填写的。

function OrdersCtrl($scope, Order){
    $scope.orders = Order.query();
    $scope.$watch('orders', function(v){
        if (!v) return;
        alert(v);
    }, true);
}

主要目标是通过选定的复选框计算成本。

但是在加载页面上我看到警报，如何在加载内容后才开始观看？

第二个小问题:
在 div 上有 ng-repeat。和所有重复的 div 喜欢

<div class="order-box row-fluid ng-scope ng-pristine ng-valid" ng-repeat="order in orders" ng-model="orders">

正常吗？

Answer 1

尝试添加标志，或在 jsfiddle 上尝试 link .

function OrdersCtrl($scope, $timeout) {
    $scope.orders = [];
    var first = true; //this doesn't belong to any scope, it will be deallocated after the current cycle.

    var ajax = function () {
        $scope.orders = [{
            id: 1,
            selected: true
        }, {
            id: 2,
            selected: true
        }, {
            id: 3,
            selected: true
        }, {
            id: 4,
            selected: true
        }];
    };

    $scope.$watch('orders', function (n, o) {
        if (first) {
            $timeout(ajax, 2000); //simulate the ajax call. Assume data comes back in 2 seconds.
        } else {
            alert(n);
        }
    });
}