Question

根据这篇文章，我试图在URL字符串中使用两个参数来链接到REST调用中的单个结果：

Set URL to SEO Friendly Title with Dashes instead of ID

我的文章和链接列表按预期填充，但是一旦点击链接以检索单个文章的详细信息，它就无法解决。我怀疑这是我“得到”我的路线。如果我声明一个路由参数，它就有效，但我需要文章的id和标题来确保唯一性。

Controllers.js

var pfcControllers = angular.module('pfcControllers', []);

pfcControllers.controller('pfcCtrl', ['$scope', 'pfcArticles', function ($scope, pfcArticles) {
    $scope.articles = pfcArticles.query();
}]);

pfcControllers.controller('pfcCtrl2', ['$scope', '$routeParams', 'pfcArticles', function ($scope, $routeParams, pfcArticles) {
    $scope.article = pfcArticles.get({ articleID: $routeParams.articleID, articleTitle: $routeParams.articleTitle });
}]);

App.js

var pfcModule = angular.module('pfcModule', ['ngRoute', 'ui.bootstrap', 'pfcServices', 'pfcControllers']);

pfcModule.config(['$routeProvider', function ($routeProvider) {
$routeProvider.
    when('/home', { templateUrl: './views/home.html'}).
    when('/categories', { templateUrl: './views/categories.html', controller: 'pfcCtrl' }).
    when('/article/:articleTitle/:articleID', { templateUrl: './views/article.html', controller: 'pfcCtrl2' }).
    otherwise({ redirectTo: '/home' });
}]);

Services.js

var pfcServices = angular.module('pfcServices', ['ngResource'])

pfcServices.factory('pfcArticles', ['$resource', function ($resource) {
    return $resource('https://myrestcall.net/tables/articles/:articleTitle/:articleID', { articleTitle: '@articletitle', articleID: '@id' });
}]);

Articles.html

    <div class="col-md-4">
    <h2>Heading</h2>
    <table class="table table-striped">
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>Category ID</th>
            <th>Link</th>
        </tr>
        <tr ng-repeat="article in articles">
            <td>{{article.id}}</td>
            <td>{{article.articletitle}}</td>
            <td>{{article.articlecategoryid}}</td>
            <td><a href="#article/{{article.articletitle}}/{{article.id}}">{{article.articletitle}}</a></td>
        </tr>
    </table>
</div>

Article.html（这是没有解析/匹配routeparams的那个。它适用于单个routeparam但不适用于两个）

<div class="row">
<div class="col-md-4">
    <h2>Heading</h2>
    <table class="table table-striped">
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>Category ID</th>
            <th>Summary</th>
        </tr>
        <tr>
            <td>{{article.id}}</td>
            <td>{{article.articletitle}}</td>
            <td>{{article.articlecategoryid}}</td>
            <td>{{article.articlesummary}}</td>
        </tr>
    </table>
</div>

在url字符串中使用多个$ routeparams

0 个答案: