1

我目前正在尝试构建我的第一个 Angular 应用程序,我可能需要一些帮助。

我正在使用标准 $resource 操作访问 REST 服务:

angular.module('wtrack', ['ngResource']).
    factory('WtrackAPI', function($resource) {
      var WtrackAPI = $resource('http://hostname/wtrack/api/w/:id');
      return WtrackAPI;
    });

这是我的控制器:

function ListCtrl($scope, $timeout, WtrackAPI){

    $scope.wdata = WtrackAPI.query(); // a list of objects displayed in my view

    $scope.addEntry = function() {   // adding an object to the list
        console.log("Adding Entry");
        var entry = {day: $scope.wdata.day, value: $scope.wdata.value};
        WtrackAPI.save(entry, 
                          function(){console.log("WTF do I need to do here to rerun WtrackAPI.query()");});
    };

}

我想要做的基本上是通过$scope.wdata = WtrackAPI.query();在 save() 完成后再次执行来更新我的模型。我怀疑角度方式只是$scope.wdata.push(entry),但在这种情况下,数据库会使用触发器将一些数据添加到条目中并进行一些复杂的排序,所以我真的很想往返并使用查询重新加载整个列表。我怎样才能做到这一点?只是调用$scope.wdata = WtrackAPI.query();保存回调不起作用,因为 $scope 显然在那里不存在。我用 $emit 和 $rootScope 等尝试了一些其他的东西,但所做的一切都让我很困惑。所以请,有人可以给我一个提示,告诉我这样做的正确方法是什么?

4

2 回答 2

5

接受的答案会让你瞬间看到一个空白模型。我推荐这个进行更清洁的模型更新:

function ListCtrl($scope, $timeout, WtrackAPI){
        $scope.queryWData = function() {
            WtrackAPI.query(function(response){
                // set the wdata here, in the callback
                $scope.wdata = response;
            })
        };
        $scope.addEntry = function() {   // adding an object to the list
            console.log("Adding Entry");
            var entry = {day: $scope.wdata.day, value: $scope.wdata.value};
            WtrackAPI.save(entry,
                function(){
                    $scope.queryWData();
                });
        };
        $scope.queryWData();
    }

我建议不要设置$scope.wdata等于$resource直接,因为在该资源响应之前,您将 $scope.wdata 为空白。在您的模型实际更新之前,这将导致大量空白内容闪烁。

为了纠正这个问题,我们$scope.wdata$resource回调中设置

于 2015-09-04T06:47:24.013 回答
4

$scope对象应该可以在闭包范围内访问,因此您应该能够编写:

function ListCtrl($scope, $timeout, WtrackAPI){

    $scope.wdata = WtrackAPI.query(); // a list of objects displayed in my view

    $scope.addEntry = function() {   // adding an object to the list

        var entry = {day: $scope.wdata.day, value: $scope.wdata.value};
        WtrackAPI.save(entry, function() {
           //$scope should be accessible here
           $scope.wdata = WtrackAPI.query();
        });
    };
}
于 2012-12-07T17:46:26.313 回答