0

我正在使用 Angular ui 在 Angular js 中进行路由。我有一个像 http://servername/#/news/14这样的网址。但我想使用别名并拥有像http://servername/#/news/news_title 这样的网址。有可能在角度ui中吗？

这是我的配置

angular.module('News', ['ui.router'])
  .config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('news', {
        url: "/news",
        templateUrl: "modules/news/views/news.html",
        controller: 'NewsCtrl'
      })
      .state('news.detail', {
        url: '^/news/:id',
        views: {
          '@': {
            templateUrl: 'modules/news/views/news_detail.html',
            controller: 'NewsDetailCtrl'
          }
        },
      });
  })
4

1 回答 1

0

当然这是可能的。但要做到这一点，你需要以某种方式将 映射news_title到 14 我猜这是一个id. 您可以编写如下内容：

$stateProvider
    .state('news', {
        url: "/news/:news_title",
        templateUrl: 'news.html',
        ...
    })

在这种情况下，您可以键入 url http://http://servername/#/news/latest_bbc_news，在您的控制器中，您可以:news_title使用$stateParams

你将如何映射news_title到14取决于你的模型。

更新

例如，您可能可以编写如下内容：

$stateProvider
    .state('news', {
        url: "/news/:news_title",
        templateUrl: 'news.html',
        resolve : {
          news_item: function(NewsService, $stateParams) {
            return NewsService.getByTitle($stateParams.news_title);
          },
        },
        controller:['$scope','$state','news_item',
          function ( $scope , $state , news_item){ 
            $scope.news_item= news_item;
        }]
     })

然后在NewsService你需要实现的方法getByTitle是直接从后端按标题获取新闻，或者你从后端获取所有新闻并将其缓存在一个变量中，如

var news = [
  {ID: 1, Title : 'A', Content : 'XXXXXXXXXXXXXXXXXXXX',},
  {ID: 2, Title : 'B', Content : 'YYYYYYYYYYYYYYYYYYYY',},
];

你必须编写自己的代码来循环遍历它并按标题找到你需要的新闻。

同样，ui-router 只是为您设置路由规则，提供正确的内容始终是您的责任。我的意思是 ui-router 不知道哪些消息的 id 为 14 和相应的标题，它只能从后端获取并由您处理。

于 2016-04-10T06:46:44.673 回答