angularjs - 将字符串直接传递给 Angular 指令？

Question

我想了解如何在 Angular 中使用指令。在 angularjs.org 上的示例中，值在 JavaScript 的作用域中设置，然后在匹配指令时引用该作用域。

模板:

  <my-customer info="naomi"></my-customer>

范围:

  .controller('Ctrl', function($scope) {
    $scope.naomi = { name: 'Cat', address: '1600 Amphitheatre' };
    $scope.igor = { name: 'Dog', address: '123 Somewhere' };
  })

模板:

Name: {{customerInfo.name}} Address: {{customerInfo.address}}

我想直接从模板传递属性。所以在这个例子中我想写一个输出的模板:

Name: Naomi

不经过范围。

Answer 1

您可以使用 linking function 的 attrs 参数来做到这一点.

module.directive('name', function () {
  return {
    link: function (scope, element, attrs) {
      console.log(attrs.info);
      // <- 'naomi'
    }
  }
});

然后在标记中:

<name info='naomi'></name>

See a live example