将字符串传递给 AngularJS 指令

Question

我想将字符串传递给 angular 指令，

<person first-name="Don" last-name="Dood"></person>
<person first-name="James" last-name="Jawalla"></person>

得到这个结果HTML:

<p>Don Dood</p>
<p>James Jawalla</p>

这是我目前拥有的。

指令:

.directive('person', function(){
  return {
    scope: {
      firstName: '@',
      lastName: '@'
    },
    templateUrl: 'person-template.html'
  }
});

人-template.html

<p>{{ firstName }} {{ lastName }}</p>

但是没有出现 firstName 或 lastName 的值。我错过了什么？

这是一个简单的问题，所以我很惊讶没有关于 SO 的好的答案。我找到的最接近的是 question，但它没有说明如何在 HTML.

中显示字符串

Answer 1

没关系，这段代码有效。我的代码中的其他地方有一个错误，使它似乎不起作用。无法删除，因为它已经有答案了。

提醒：如果您将字符串作为属性传递，请使用 @ 符号（就像我在问题中所做的那样）。如果你传递一个对象、变量等并且你希望它是双向绑定的，那么使用 = 符号。

Answer 2

'@' 是此处使用的正确范围绑定，因为字符串正在传递给指令。

我认为您在 DDO 中缺少限制：'E'，但除此之外，您的代码没问题。

将字符串传递给 AngularJS 指令

Pass a string into an AngularJS directive

angularjs

angularjs-directive