1

私は記事でウェブサイトを作成しようとしています。すべての記事のリストを表示するページがあり、記事の詳細を表示するページを作成しようとしています。angular.js を使用して、データの json を取得します。記事のリストを取得するのに問題はありません:

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

しかし、今は、たとえば ID 4 の記事にのみアクセスしたいのですが、どうすればよいですか? URLに入力された主キーをjavascriptに挿入する方法はありますか? 私はAngularが初めてで、簡単な方法があると確信しています!

4

1 に答える 1

1

私の理解が正しければ、記事の詳細ビューのために、部分的なテンプレートとルートを定義する必要があります。

例はこちら

より具体的には、次のようなものが必要です。

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

上記が行うことは、フォームの URL をハイジャックすることであり、サーバーに対して/articles/5/実際にその要求を実行する代わりに、 . もちろん、これは記事の詳細テンプレートであり、ArticleDetailCrtl コントローラーによって処理されます。GETpartials/article-detail.html

ArticleDetailCrtl コントローラー関数に、 $routeParams サービスを含めることを忘れないでください。articleIdこれにより、上で定義したなどの url パラメータにアクセスできるようになります。

最後に、記事リスト テンプレートでこれらのリンクを生成します。例えば:

<ul>
<li ng-repeat="article in articles"><a href="/articles/{{article.id}}/">{{article.title}}</a>
</ul>
于 2013-06-10T12:33:27.543 に答える