Angularjs 自定义指令不适用于 ui-sref

Question

首先，这个有效：<a ui-sref="students({courseId: $ctrl.Course.Id})">{{ student.Name }}</a> 这支持我的路由器工作正常。

我创建了一个自定义指令：link: "=link"

<div ng-if="$ctrl.link && $ctrl.link.Name && $ctrl.link.State">
            <a ui-sref="{{$ctrl.link.State}}">{{$ctrl.link.Name}}</a>
</div>

为什么这不起作用：

<div link="{ Name: 'View Students', State: 'students({courseId: $ctrl.Course.Id})' }">

这里是错误：

Transition Rejection($id: 0 type: 6, message: The transition errored, detail: Error: Param values not valid for state ‘students’)

更新：我的自定义指令

angular.module('Foo').component('Bar', {
        controller: LinkController,
        templateUrl: "link.tpl.html",
        transclude: true,
        bindings: {
            link: "=link",
    });

Answer 1

我解决了这个问题如下：

我如何调试：我尝试用123（数字）替换'$ctrl.Course.Id'，它有效。所以我知道我的自定义 link 指令正在工作。

<div link="{ Name: 'View Students', State: 'students({courseId: $ctrl.Course.Id})' }">

后来我才知道是因为我把这个'$ctrl.Course.Id'放在单引号里面，它会把它解析成一个字符串，而不是一个数字。

所以，这就是我所做的：

转到组件，创建一个对象：
this.studentsLink = { Name: 'View Students', State: 'students({courseId:'.concat(this.$stateParams.courseId, '})')};

我的this.$stateParams.courseId是一个字符串。如果是数字，我们应该做 this.$stateParams.courseId.toString()

然后转到模板：

<div link="$ctrl.studentsLink">

希望这对以后遇到同样问题的开发者有所帮助。

Angularjs 自定义指令不适用于 ui-sref

Angularjs custom directive cannot work for ui-sref

angularjs

angularjs-directive

ui-sref