javascript - 加载数据时，Angular 的 Resource Promise 不会重新呈现

Question

我是 AngularJS 的新手，无法获得资源 promise 在加载数据时重新呈现 View 。这导致 {{}} 被替换为空白(来自 promise)，但随后 View 保持原样。

我见过很多使用 $apply、$digest、$watch 等解决 promises 问题的例子，我对这些建议持开放态度，很想知道我的方法的根本问题。这是我的 Controller 代码

<div ng-controller='pook'>
<p>There are {{posts.length}} posts</p>
<div ng-repeat='post in posts'>
    <h3>{{post.title}}</h3>
    <div>{{post.text}}</div>
    <a href='/readPost/{{post.id}}'>More</a>
    |  -
    <a href='/editPost/{{post.id}}'>Edit</a>
    |  -
    <a href='/deletePost/{{post.id}}'>Delete</a>
</div>
</div>
<script type='text/javascript'>function pook($scope, $http, $route, $routeParams, $resource)
{
/*Approach #1 does work
$http.post('/').success(function(data, status, headers, config)
{
  $scope.posts = data.posts;
});
*/

var User = $resource('/');

/*Approach #2 does work
User.save('', function(data)
{
  $scope.posts = data.posts;
})
*/

//Approach #3 does NOT work -> renders blanks and never re-renders on loaded data
$scope.posts = User.save().posts
}
</script>

我加载的脚本是

//ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js'//ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular-resource.min.js'

我想要的 promise 行为的描述在这里 http://docs.angularjs.org/api/ngResource .$资源

Answer 1

将您的抓取更改为:

var User = $resource('/');
$scope.postsResponse = User.$save();

和你绑定(bind)到:

<div ng-repeat='post in posts'>
  <h3>{{postResponse.post.title}}</h3>
  <div>{{postResponse.post.text}}</div>
</div>

由于 Angular 基于 promises，因此可以将 $http 或 $resource 操作的响应直接绑定(bind)到 HTML，当它被解析时，angular 会更改属性。

如果可能，从服务器响应中移除包装器({posts: []} 到 [])。如果这样做，您将需要提示资源响应是一个数组。看docs了解更多信息。

错误发生是因为当你在资源上调用一个方法时，它返回一个空对象，所以它没有.posts。但是如果你将它绑定(bind)到你的代码，angular 会等到它到达那里。

这就是您在前端应该做的所有事情，您确定服务器响应预期的内容吗？ 你确定你需要一个帖子来检索数据吗？