Angular'的资源承诺在加载数据时不会重新渲染

Angular's Resource Promise is not re-rendering when data loaded

本文关键字：数据 新渲染 加载 承诺 资源 Angular      更新时间：2023-09-26

我是AngularJS的新手，当数据加载时，我很难获得资源的承诺来重新渲染视图。这导致{{}}被空白替换(来自承诺)，但视图只是保持这种方式。

我已经看到了很多用$apply、$digest、$watch等方法解决承诺问题的例子，我愿意接受这些建议。我想知道我的方法的根本问题是什么。这是我的控制器代码

<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。美元资源

设置为:

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

和bind to:

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

由于angular是基于承诺的，所以可以将$http或$resource动作的响应直接绑定到HTML中，当它被解析后，angular会更改属性。

如果可能的话，从服务器响应({posts: []}到[])中删除包装器。如果这样做，就需要提示资源响应是一个数组。查看文档获取更多信息。

这个错误的发生是因为当你在资源上调用一个方法时，它返回一个空心对象，所以它没有.posts。但是如果你把它绑定到你的代码中，angular会一直等待，直到它到达。

这是所有你应该做的在前端，你确定服务器回答什么是预期的?您确定需要post来检索数据吗?

相关文章：