Question

ng-repeat in md-sidenav

<md-list>
        <md-list-item ng-repeat="it in cars">
              {{ it.name }}
        </md-list-item>
</mdlist>

汽车控制器

    self.refreshUI = function(select) {

        carService.getAllCars()
            .then(function (res) {

                $scope.cars = carService.carsList;
                console.log($scope.cars);


            }, function (err) {
                //error
            })

    };

    // Load all registered cars
    self.refreshUI(null);

上面的代码在加载控制器（最后一行）时运行，并且运行正常。但是当我创建新车（汽车存储在mysql数据库中）并且我想通过self.refreshUI（）函数更新$ scope.cars数组时，它将无法工作，直到刷新页面mannualy。

来自refreshUI函数的

console.log($scope.cars)返回正确的结果，但console.log(angular.element($0).scope().cars)给出错误的数组（没有新车）

汽车服务

    function carService($q, $http) {

        var cars = this;
        cars.carsList = {};

        cars.getAllCars = function() {
            var defer = $q.defer();

            $http.get("http://car.app/getCars")
                .success(function(res) {
                    cars.carsList = res;
                    defer.resolve(res);
                })
                .error(function(err, status){
                    defer.reject(err);
                });

            return defer.promise;

        };

        return cars;
}

哪里可能是问题？

//编辑：$ rootScope工作正常，但我仍然想使用$ scope

Answer 1

为什么不通过$http电话使用返回的Promise？除了更好的代码风格，它可以解决您的问题。有了这种服务控制器基础设施，我从来没有像这样的“绑定问题”。

function carService($q, $http) {

    var cars = this;
    cars.carsList = {};

    cars.getAllCars = function() {
        return $http.get('http://car.app/getCars').then(function (response) {
            cars.carsList = response.data;
            return response.data;
        });
    };

    return cars;
}

在您的控制器中，您可以执行类似的操作：

self.refreshUI = function() {

    carService.getAllCars()
        .then(function (data) {
            // just obtain the promise data
            $scope.cars = data;
        }, function (err) {
            // error handling
        });

};

self.refreshUI();

$ http请求不起作用后更新数组

1 个答案: