1

私はAngularJSを初めて使用し、データがロードされたときにビューを再レンダリングするというリソースの約束を得るのに苦労しています。これにより、{{}} が (promise から) 空白に置き換えられますが、ビューはそのままになります。

私は、$apply、$digest、$watch などを使用して Promise が解決される問題の多くの例を見てきたので、これらの提案を受け入れて、私のアプローチの根本的な問題を知りたいと思っています。これが私のコントローラーコードです

<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'

私が望む約束の振る舞いの説明はここにあります http://docs.angularjs.org/api/ngResource .$resource

4

1 に答える 1

2

フェッチを次のように変更します。

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

そしてあなたのバインド：

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

angular は promise に基づいているため、$http または $resource アクションの応答を HTML に直接バインドすることが可能であり、それが解決されると、angular はプロパティを変更します。

可能であれば、サーバーの応答 ( {posts: []}to []) からラッパーを削除します。これを行う場合、応答が配列であることをリソースに示唆する必要があります。詳細については、ドキュメントを参照してください。

リソースでメソッドを呼び出すと、中空のオブジェクトが返されるため、エラーが発生します.posts。しかし、それをコードにバインドすると、Angular はそこに到達するまで待機します。

フロントエンドで行う必要があるのはこれだけです。サーバーは期待どおりに応答しますか? データを取得するためにポストが必要ですか?

于 2013-03-02T12:28:00.227 に答える