Question

我用这个js脚本创建了一个角度应用程序：

/**
 * Services
 **/
var app;

app = angular.module('example.api', ['ngRoute', 'ngResource', 'controllers']);

app.factory('Post', ['$resource', function($resource) {
    return $resource('/api/posts/:id', {post: '@id'});
}]);

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/posts/:id', {templateUrl: "static/js/post_detail.html", controller: "PostListController"})
                  .when('/posts', {template: '<p>No link selected</p>', controller: "PostDetailController"})
                  .otherwise({redirectTo: '/posts'});
}]);

/**
 * Controllers
 **/
var controllers;

controllers = angular.module('controllers', []);

controllers.controller('PostListController', ['$scope', 'Post', function($scope, Post) {
    $scope.posts = Post.query();
}]);

controllers.controller('PostDetailController', ['$scope', 'Post', function($scope, Post) {
    $scope.post = Post.query();
}]);

和这个html模板：

<div class="row" ng-app="example.api">
    <div class="col-md-2" ng-controller="PostListController">
        <ul>
            <li ng-repeat="post in posts">
                {% verbatim %}
                    <a href="#/posts/{{ ::post.id }}">{{ ::post.id }}</a>
                {% endverbatim %}
            </li>
        </ul>
    </div>
    <div class="col-md-10" ng-controller="PostDetailController">
        <div ng-view></div>
    </div>
</div>

我的问题出在PostDetailController。我不知道如何正确使用$resource。我刚试过$scope.post = Post.query()，但我可能需要告诉资源查看我认为的变量id。

我查看了文档，但仍然无法弄明白。

除此之外，我想知道在加载PostListController中的帖子之前是否可以避免网站首先显示我的未渲染模板。这不是一个真正的问题，但在渲染之前网站的闪烁很难看。

Answer 1

使用Post.get(id)获取特定条目。
使用resolver。有了它，你可以告诉angular在重定向到新路径之前解决一些承诺。

编辑：

您必须注入$routeParams才能获得路线的ID。现在您可以执行此操作：$scope.post = Post.get($routeParams.id);

AngularJS中的DetailController和路由

1 个答案: