Question

我创建了一个带有index.html的项目，其中包含指向其他页面的特定链接。我的路由按预期工作，但我想知道在其他网页上链接的最佳方法是什么。

澄清一下：

我的index.html页面有路由：

饲料 Bblog 市井招聘广告

现在我感到好奇的是我如何在这些页面中路由链接。

例如，我的Bblog页面包含我想在同一页面内打开的选项卡。现在，例如每当我点击一些标签链接时，它会将我重定向到我的index.html，因为我的.otherwise路由设置为/.

Answer 1

不确定您用于路由的引擎或库。虽然我不久前也面临同样的要求。

我们正在使用ui-router进行路由。它与Angulars路由非常相似。

路由表中的代码段包含与此类似的内容。

$stateProvider
            .state('home', {
                url: '/',
                templateUrl: '/views/index',
            })
            .state('orders', {
                url: '/orders',
                templateUrl: '/views/orders',
            })
            .state('orderdetail', {
                url: '/orders/detail/:id',
                templateUrl: '/views/orderdetail',
            })
            .state('orderdetail.address', {
                url: '/:addressId',
                templateUrl: '/views/orderdetail',
            })

基本上，您使用.dot表示法来分隔嵌套视图。因此orderdetail.address嵌套在orderdetail

中

这意味着上面的路由将允许您在/orders/detail/myOrderId查看订单详细信息的概述，并通过访问/orders/detail/myOrderId/myaddressId进一步深入查看地址

如果您正在使用ui-router，那么您将获得有关嵌套视图的更多信息on this link

如果您正在使用角度ngRoute，则[ngRoute][3]文档和支持plunker会演示如何堆叠路线。

所以（来自plunker） -

.config(function($routeProvider, $locationProvider) {
    $routeProvider
     .when('/Book/:bookId', {
      templateUrl: 'book.html',
      controller: 'BookController',
      resolve: {
        // I will cause a 1 second delay
        delay: function($q, $timeout) {
          var delay = $q.defer();
          $timeout(delay.resolve, 1000);
          return delay.promise;
        }
      }
    })
    .when('/Book/:bookId/ch/:chapterId', {
      templateUrl: 'chapter.html',
      controller: 'ChapterController'
    });

这将为您提供/book/myBookId和/book/myBoodId/ch/myChapterId

Angular JS Routing - SPA内部的链接

1 个答案: