angularjs - 如何使用 ui-router 在模板内获取路由参数？

Question

我有这样的代码:

$stateProvider
  .state('managementPanels-show', {
    url: '/management-panels/show/:id',
    template: '<mp-show></mp-show>',
    data: {},
    resolve: {}
  });

如何将 :id 添加到模板中？

Answer 1

您不能直接访问 :id在模板中。您需要注入(inject) $stateParams在您的 Controller 中提供服务并公开 :id Controller 属性$scope

.controller('YourController', function ($scope, $stateParams){
   $scope.id = $stateParams.id;
})

现在，在您的模板中，您可以通过以下方式访问 id:

$stateProvider
  .state('managementPanels-show', {
    url: '/management-panels/show/:id',
    template: '<mp-show>{{id}}</mp-show>',
    controller: 'YourController',
    data: {},
    resolve: {}
  });