使用 ui-router 创建路由参数

Posted 2023-02-22

【中文标题】使用 ui-router 创建路由参数

【英文标题】：creating a route Param using ui-router

【发布时间】：2015-11-21 02:51:11

【问题描述】：

我无法设置和维护路由参数。当我设置参数时。它去正确的地方。但是，如果我更改路线，内容不会改变。我试图制作一个视图对象，但 home.name 状态不会用这种方法呈现。我只能使用两个绝对路径获取要显示的模板。

Could not resolve '#/home/Adam Harvey' from state 'home'

我找到了一个很棒的链接https://github.com/angular-ui/ui-router/wiki/URL-Routing#stateparams-service

开始：我用 ng-repeat 创建了一个简单的列表。这是一个简短的例子

$scope.iterants =  
   [
       
        name: 'Adam Harvey',
        type: 'Hotel',
        dates: '01/21/2015-01/22/2015',
        location: 'Rockville Maryland',
        status: 'Confirmed'
        ,
        
        name: 'Jana Harvey',
        type: 'Hotel',
        dates: '01/21/2015-01/22/2015',
        location: 'Rockville Maryland',
        status: 'Confirmed'
        
    ];

在我的 html 模板中，我想在每个人的姓名上放置一个 ui-sref 作为链接，以便在另一个模板上查看他们。

          <td><a ui-sref="itinerary.namename:person.details">person.name</a></td>

在我的配置中，我这样设置，控制器通过了 $stateParams

  .config(function config( $stateProvider ) 
  $stateProvider.state( 'home.name', 
    url: '/home/:name',
    views: 
      "main": 
        controller: 'AboutCtrl',
        templateUrl: 'src/app/about/about.tpl.html'
      
    ,
      data: pageTitle:'About'
  );
)

.controller( 'AboutCtrl', function AboutCtrl( $scope, $stateParams ) 
  $stateParams.name;
);

在家庭控制器中。我已经像这样设置了我的配置和控制器......

.config(function config( $stateProvider ) 
  $stateProvider.state( 'home', 
    url: '/home',
    views: 
      "main@": 
        controller: 'HomeCtrl',
        templateUrl: 'src/app/home/home.tpl.html'
      ,
        resolve: [
            name: ['$stateParams', function($stateParams)
                return $stateParams.name;
            ]
        ]
    ,
    data: pageTitle: 'Home' 
  );
)

更新

【问题讨论】：

不应该在 home.name 中解析 name 而不是 home 吗？另外，我相信 resolve 需要一个对象，而不是一个数组。

【参考方案1】：

问题在于您对ui-sref 指令的使用。您必须将状态名称和参数作为对象传递，如下所示：

<td><a ui-sref="home.name( name: person.name )">person.name</a></td>

【讨论】：

非常感谢。我刚刚在文档上重新阅读了一遍。但是，您如何访问该模板？我正在更改参数。我确实对孩子下了决心，但它没有把我送到 home.name 的 templateUrl。

很难说没有看到你的其余代码。您的 home.name 状态将其视图放在主视图中名为 main 的 ui-view 中。我的猜测是您的意思是在根模板中引用 main，因此“main”实际上应该是“main@”。 github.com/angular-ui/ui-router/wiki/…

对你所说的有了更好的理解。添加了 在主路由上创建了绝对路径。这使我可以访问。但是，我需要使用两个绝对路径来完成这项工作。试图删除 home.name 上的视图对象，但这会产生错误。

一个新问题可能有助于使事情更清楚。我很乐意提供帮助。