Question

我正在尝试创建一个包含文章的网站。我有一个页面显示所有文章的列表，我尝试做一个显示文章细节的页面。我使用angular.js来获取我的数据的json。因为我只需要这样做，所以获取我的文章列表没有任何问题：

function ArticleListCtrl($scope, $http) {
    $http.get('/articles/?format=json').success(function(data) {
        $scope.articles = data;
    });
}

但现在我只想访问id为4的文章。我该怎么做？有没有办法将在url中输入的主键注入javascript？我是棱角分明的新人，我很确定有一种简单的方法！

Answer 1

如果我理解正确，您需要的是定义部分模板和路线，查看文章的详细视图。

一个例子是here

更具体地说，您需要的是以下内容。

angular.module('myapp', []).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/articles/:articleId', {templateUrl: 'partials/article-detail.html', controller: ArticleDetailCtrl}).
      otherwise({redirectTo: '/articles'});
}]);

以上所做的是劫持/articles/5/形式的网址，而不是实际执行GET请求到您的服务器，它只会要求partials/article-detail.html。这当然是您的文章详细信息模板，将被处理通过ArticleDetailCrtl控制器。

在ArticleDetailCrtl控制器功能中，不要忘记包含$routeParams 服务。这样您就可以访问我们的articleId等网址参数定义如上。

最后要做的是在文章列表模板中生成这些链接。 e.g：

<ul>
<li ng-repeat="article in articles"><a href="/articles/{{article.id}}/">{{article.title}}</a>
</ul>

从视图中注入变量到我的角度控制器？

1 个答案: