4

我的AngularJS应用程序有一个item list视图（基本上是用户可以从中选择的一大列项目）和一个item detail视图。我目前设置的路线如下：

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider.
      when('/', {
        templateUrl: 'partials/index',
        controller: indexCtrl
      }).
      when('/itemDetail/:id', { 
        templateUrl: 'partials/itemDetail',
        controller: itemDetailCtrl
      }).
      otherwise({
        redirectTo: '/'
      });
    $locationProvider.html5Mode(true);
  }]);


function itemDetailCtrl($scope, $http, $routeParams) {
  $http.get('/api/post/' + $routeParams.id).
    success(function(data) {
      $scope.post = data.post;
    });
}

对于itemDetail/:id路线，我希望这里有多个 :id 的选项（例如 '/:id1+:id2+:id3'）。如果用户选择一个项目、两个项目或更多项目，系统应该可以工作。

我还无法开始工作的可能解决方案：

  • 当用户选择多个项目时，我的应用程序会id在数组中记录这些项目的唯一性
  • 当进入详细视图时，路由变成'itemDetail/STRINGwhere STRINGis a string，由id数组中的所有 s 组成，+它们之间有 a。例如：itemDetail/item1+item2+item3
  • 在itemDetailCtrl中，我取字符串，在符号处拆分它+并创建一个新数组，如前所述
  • 然后我使用 anng-repeat来获取这些ids信息并将我的数据库中的详细信息加载到我的视图中。

这是我想到的第一个解决方案，但它似乎相当费力且不是特别优雅。有没有更好的方法来实现这一点，如果是这样，我如何更新 itemDetailCtrl 以反映多个 id？

4

1 回答 1

0

由于 URL 不是针对特定项目的，并且可以有多个我会使用一个更像的 URL itemDetail?item=item1&item=item2&item=item3，然后$routeParams你应该得到$routeParams.item = [item1, item2, item3]

于 2015-03-06T20:16:15.513 回答