javascript – 在Angular JS中,如何将指令属性中的数据注入模板?

前端之家收集整理的这篇文章主要介绍了javascript – 在Angular JS中,如何将指令属性中的数据注入模板?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这是我的指示:
  1. app.directive("helloWorld",function() {
  2. return {
  3. restrict: "E",scope: {
  4. name: "bind"
  5. },template: "<div>a {{name}} a</div>"
  6. };
  7. });

这是我如何使用它:

  1. <hello-world name="John Smith"></hello-world>

当我运行它时,我希望这个页面是这样的:

  1. <hello-world>
  2. <div>a John Smith a</div>
  3. </hello-world>

但由于某种原因,名称不会被注入,实际结果如下:

  1. <hello-world>
  2. <div>a {{name}} a</div>
  3. </hello-world>

我缺少什么?我正在使用Angular JS 1.0.2

解决方法

范围声明很奇怪.我不确定“绑定”声明 – 可能是以前版本的东西.

绑定到指令属性的当前语法如下所示:

  1. return {
  2. restrict: "E",scope: {
  3. name: "@name"
  4. },template: "<div>a {{name}} a</div>"
  5. };

通常,@ attributeName.在这里查看more information on directives.

猜你在找的JavaScript相关文章