1

我在一个页面上多次添加以下 div。

<div class="box span6">
    <div class="box-header">
        <h2 class="custom"><i class="fa-icon-group" style="opacity:.7"></i><span class="break"></span>[TEXT]</h2>
    </div>
    <div class="box-content">
        <p><strong>[TEXT 2]</strong></p>
        <ul>
            <li ng-repeat = "course in courses">{{course}}</li>
        </ul>
    </div>
</div>

我想写一个指令，但我不知道如何将值传递给指令。

例如。我想为 TEXT 传递“名称”，为“文本 2”传递“电子邮件地址”，为“课程”传递书籍列表。

有没有办法将值传递给指令，比如将值传递给函数？

4

2 回答 2

1

函数的参数就像指令的 HTML 属性。在您的链接和编译函数中，您会获得一个属性对象，其中包含元素上所有属性的规范化名称和值。

例如，您可以拥有<div data-awesome-directive data-color="red" data-size="16"></div>. 指令的链接函数可能看起来像link: function (scope, element, attributes) { ... }. 在那里，您可以访问属性的值作为对象的属性：attributes.awesomeDirective、attributes.color和attributes.size。注意名称是如何标准化的（awesome-directive变成awesomeDirective）。

对于更高级的东西，例如函数调用或表达式，请查看$parse. 它可以解析一个表达式，例如foo.bar()并在一个范围内调用它。

！

于 2013-08-28T11:42:29.820 回答
0

要添加到 stevuu 的响应中，如果您想将值传递给作为范围内变量的指令，您可以执行以下操作：

<div data-awesome-directive data-color="selected_color" ... ></div>

whereselected_color在包含范围内设置。在链接函数中，可以通过以下方式在指令的范围内获取和设置颜色：

link: function(scope, element, attributes) {
  scope.color = scope.$eval(attributes.color);
}
于 2013-11-13T04:08:17.103 回答