在 angularjs 指令中传递路径答案

【问题标题】：passing paths in an angularjs directive在 angularjs 指令中传递路径
【发布时间】：2013-06-19 20:01:20
【问题描述】：

我有一个指令，我想传递一个路径

<mydirective api="/my/tomcat/server?asd=123&efg=456">

但是我得到“Lexer Error: Unexpected next character”。我认为需要进行一些编码。有人可以建议吗？

【问题讨论】：

【解决方案1】：

我不确定您为什么在没有看到您的代码的情况下收到词法分析器错误，如果您可以更新帖子，我们也许能够说明为什么会发生这种情况。同时，有几种方法可以在指令中检索属性值。并非所有都可以使用字符串文字。

1) @ 隔离作用域绑定：这会解析值并与您的 HTML 一样工作。解析实际上发生在稍后，因此该值不会立即在指令的内部方法中可用（即link 等），最好在指令的template 方法中使用。例如：

scope: {
    api: '@'
}

2) = 隔离范围绑定：如果您将表达式用单引号括起来，这将起作用，因为它将属性作为表达式进行评估。例如：

scope: {
    api: '='
}

在您的 HTML 中（注意单引号）：

<mydirective api="'/my/tomcat/server?asd=123&efg=456'">

3) 属性评估：这允许您直接从指令的内部方法评估属性字符串值，并将与您的 HTML 一样工作。例如：

link: function(scope,element,attrs){
    console.log(attrs.api);
}

您可以在AngularJS directive doc here 中阅读有关指令的更多信息。

【讨论】：

【解决方案2】：

Angular 尝试评估 api 属性中的表达式，你必须用引号括起来：

<mydirective api="'/my/tomcat/server?asd=123&efg=456'">

【讨论】：

单引号帮助我还在我的链接函数链接中做了以下操作：function(scope, element, attrs){ scope.server = attrs['server']; scope.api = attrs['api'] }