0

我决定通过制作一个简单的应用程序开始学习 AngularJS。

服务器端应用程序是用 ExpressJs 构建的,但下面使用的资源 ( /movie/:id ) 尚未实现,因此指向此 URL 将导致404 (Not Found) 错误。所以只有得到'/'才有效。

我想看看 $resource 的行为如何,所以我做了这个简单的测试:

var app = angular.module("app", ["ngResource"]);

app.factory("Movie", function ($resource) {
    return $resource("/movie/:id");
})

app.controller("MovieCtrl", function($scope, Movie) {
    $scope.test = function () {
        Movie.query();
        return 42;
    } 
});

还有我的模板文件:

<div ng-app="app">
    <div ng-controller="MovieCtrl">
        {{ test() }}
    </div>
</div>

正如预期的那样,模板被渲染并正确显示了“42”,但如果我在 Chrome 开发人员工具中查看控制台,我会一直看到以下错误(也如预期的那样):

GET http://localhost/movie 404 (Not Found)

但是这条消息被无限期地打印并且永远不会停止,就好像我的电影资源一直试图到达/movie即使经过一百次尝试它仍然失败。

先感谢您。

4

1 回答 1

2

这是因为在获得服务器响应后Movie.query()调用。$scope.$apply()

每次$scope.$apply()调用时,angular 都会进行脏检查(再次调用test并因此再次调用Movie.query())以找出是否有任何变化。这会导致无限循环。

Movie.query()从 中移出,test()这应该可行。

让我说清楚 - 看看这个伪代码:

var watches = ['$scope.test()'];
var previous = {};
var values = {};

$rootScope.$apply = function(){
  previous = values;
  values = {};
  var dirty = false;  
  for (var i =0;i<watches.length;i++){
      var expression = watches[i];
      values[expression] = value = eval(expression);
      if(value!=previous)dirty=true;
  }
  if(dirty)$rootScope.$apply();
}

Movie.query = function(){
   setTimeout(function(){
      $rootScope.$apply();
   },300);
}

$scope.test = function(){
   Movie.query();
   return 42;
}

所以流程如下:

  1. $scope.apply();
  2. $scope.test();
  3. 电影.query(); -> setTimeout($scope.apply,100)(回到开头);

等等..

于 2013-06-21T12:44:25.097 回答