Question

我有一个使用AngularJS的应用。根据我的观点，我有一些看起来像这样的东西：

<span>My URL: <a ui-sref="mystate({ arg1_name: 'arg1_val', arg2_name: 'arg2_val'})">XXX</a></span>

这完全符合我的预期。没问题。

但是，我想将 XXX 替换为<a>标记中的实际网址。我怎么做？只需用整个ui-sref表达式替换XXX就不起作用。

Answer 1

如果您使用的是路由器版本0.2.0，则有一种新方法可以从状态配置中获取URL。您可以使用$state.href(stateOrName [, params] [, options])。如果您在范围上放置$state实例，则可以执行以下操作：

<span><a 
   ui-sref="mystate({ arg1_name: 'arg1_val', arg2_name: 'arg2_val'})">
   {{$state.href('mystate', { arg1_name: 'arg1_val', arg2_name: 'arg2_val'})}}
</a></span>

选项可以是： -

1）lossy Boolean（默认为true）如果为true，并且如果没有与第一个参数中提供的状态相关联的url，则构造的href url将从第一个可导航的祖先（也就是具有有效url的祖先）构建）。

2）inherit Boolean（默认为false）如果为true，则从当前url继承url参数。

3）相对stateObject（默认$ state。$ current），当使用相对路径转换时（例如＆＃39; ^＆＃39;），定义哪个状态是相对的。

4）绝对布尔值（默认为false）如果为true则会生成绝对URL，例如＆＃34; http://www.example.com/fullurl＆＃34;

除非您将其与范围或控制器实例关联（如果您使用控制器为As），否则您将无法在视图中访问注入的$state。因此，您可以在控制器上添加范围方法。

 $scope.getUrl = function(state, params){
     return $state.href(state, params, anyOptions);
 }

并在您看来： -

{{getUrl('mystate', { arg1_name: 'arg1_val', arg2_name: 'arg2_val'})}}

并通过调用getUrl函数在视图上访问它。如果您希望跨控制器使用此功能，您可以将其移动到utilityService函数或将实用程序方法放在运行块中的rootScope上，以便任何子作用域都可以访问它（尽管对于单元测试，您可能需要基于它进行模拟在你的设置上。）

请记住注入$state。

Answer 2

您可以使用$state.href()方法。 ui-sref指令在内部使用此更新href。

PSL的回答有两种正确的方法。

如果使用

{{$state.href('mystate', { arg1_name: 'arg1_val', arg2_name: 'arg2_val'})}}

$state使用$scope.$state = $state

注入范围

如何在链接文本中插入有角度的ui-sref？

2 个答案: