angularjs锻炼任何状态所需的参数答案

【问题标题】：angularjs workout required parameters for any stateangularjs锻炼任何状态所需的参数
【发布时间】：2014-12-16 03:46:42
【问题描述】：

我试图列出 stateprovider (angularjs 1.2.26) 中存在的所有 URL。

给定以下示例（非常削减状态列表）：

angular.module('app')
.config(function ($stateProvider) {

    $stateProvider
        .state('app.vendors', {
            url: '/vendors',
            templateUrl: 'app/vendor/list.html',
            controller: 'Vendor.ListController as vm',
        })
        .state('app.vendor', {
            url: '/vendor/{vendorId}',
            templateUrl: 'app/vendor/details.html',
            controller: 'Vendor.DetailsController as vm',
            data: {
                subnav: [
                    { title: 'Details', icon: 'fa-align-left', state: 'app.vendor', permissions: 'get-vendor', exactStateOnly: true },
                    { title: 'Sites', icon: 'fa-archive', state: 'app.vendor.sites', permissions: 'get-site' },
                    { title: 'NCRs', icon: 'fa-copy', state: 'app.vendor.ncrs', permissions: 'get-vendor' }
                ],
                requiredPermissions: ['get-vendor']
            }
        })
        .state('app.vendor.sites', {
            url: '/sites',
            templateUrl: 'app/vendor/site/list.html',
            controller: 'Vendor.Site.ListController as vm',
            data: {
                requiredPermissions: ['get-site']
            }
        })
        .state('app.vendor.site', {
            url: '/site/{siteId}',
            templateUrl: 'app/vendor/site/details.html',
            controller: 'Vendor.Site.DetailsController as vm',
            data: {
                requiredPermissions: ['get-site']
            }
        })
        .state('app.vendor.ncrs', {
            url: '/ncrs',
            templateUrl: 'app/vendor/ncr/ncrList.html',
            controller: 'Vendor.NCR.NCRListController as vm',
            data: {
                requiredPermissions: ['get-vendor']
            }
        });
});

要进入特定的供应商，您将使用状态：

app.vendor({vendorId: 1})

去它的网站

app.vendor.site({vendorId: 1, siteId: 2})

如果我将 $state 对象传递给控制器，我可以使用 state.get() 列出所有状态。

如果我列出它们，则 url 仅包含最后一部分（即配置中的内容，以及相对于其父级的内容）。我可以使用 $state.href('app.vendor.site') 这将给我几乎整个 url，但错过了参数。我试图在运行时找到一种方法来知道它需要什么或至少需要多少参数。

我的目标是尝试为我们的 Angular 应用程序中的每个页面创建一个基本的冒烟测试，以确保它加载某些内容并且不会通过控制台中的错误。我不想手动维护带有参数的URL列表。（我们所有的参数都是int ID，所以我可以简单地在参数中使用“1”来测试url）。

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

状态的私有部分包含params 和ownParams 对象。您可以使用装饰器来访问这些内部变量。请参阅我之前关于使用装饰器公开整个内部状态对象的答案：UI-Router $state.$current wrapper for arbitary state

装饰完状态对象后，使用$$state() 函数检索私有部分。然后查询 state 的参数并生成 href。

angular.forEach($state.get(), function(state) {
  var paramKeys = state.$$state().params.$$keys();
  var fakeStateParams = {};
  angular.forEach(paramKeys, function(key) { fakeStateParams[key] = key; });

  console.log($state.href(state, fakeStateParams));
});

【讨论】：