AngularJS：将ui-router状态参数传递给表达式

I want to pass in a parameter to ui-sref using UI-Router. Usually it would be something like:

我想使用UI-Router将参数传递给ui-sref。通常它会是这样的:

ui-sref="example.state({param: value})"

However, in my controller I set the routes in an array of objects like:

但是,在我的控制器中,我将路径设置为一个对象数组,如:

self.dynamicId = $stateParams.id;

self.menu = [
  {
    label: 'Example1',
    route: 'example.state1',
    stateName: 'state1'
  },
  {
    label: 'Example2',
    route: 'example.state2',
    stateName: 'state2'
  }
];

How do I pass in the dynamicId parameter using an Angular expression in my template?

如何在模板中使用Angular表达式传递dynamicId参数?

<div ng-repeat="link in menu">
    <a ui-sref="{{ link.route }}"></a>
</div>

Right now I'm hardcoding the state name, which sort of defeats the purpose of using ui-sref:

现在我正在硬编码州名,这有点打败了使用ui-sref的目的:

<a ui-sref="example.{{stateName}}({id: dynamicId})"></a>

2 个解决方案

#1

I would say, that similar issue is discussed here

我想说,这里讨论类似的问题

Angularjs adding html to variable with ui-sref link

In a nutshell (check the working plunker) - we can use combination of the natural Angular and UI-Router features:

简而言之(检查工作的plunker) - 我们可以结合使用自然的Angular和UI-Router功能:

• ng-href (doc here)

ng-href(doc这里)

• $state.href() (doc here) and

$ state.href()(doc here)和

NOTE: This would work for params defined as part of url (not just params : {} - without url representation)

注意:这适用于定义为url的一部分的params(不仅仅是params:{} - 没有url表示)

The link would look like this:

链接看起来像这样:

<a ng-href="{{$state.href(myStateName, myParams)}}">

I'd recommend to play with this plunker, to see it in action.

我建议玩这个弹药,看看它在行动。

#2

I don't think it is possible right now. Have a look at this issue. One solution would be to precalculate the url with stateName and dynamicId using $state.href if this is possible in your scenario.

我认为现在不可能。看看这个问题。一种解决方案是使用$ state.href使用stateName和dynamicId预先计算url,如果在您的方案中这是可能的话。