Angular Directive中的一种方法绑定
[英]One way binding in Angular Directive
问题描述
如何在角度指令中使用一种方式绑定？ 我找不到一个简单易用的示例，而且文档也不易遵循：
＆或＆attr-提供一种在父作用域的上下文中执行表达式的方法。 如果未指定attr名称，则假定属性名称与本地名称相同。 给定和小部件的作用域定义：{localFn：'＆myAttr'}，然后隔离作用域属性localFn将指向count = count + value表达式的函数包装。 通常希望将数据从隔离范围通过表达式传递到父范围，这可以通过将局部变量名称和值的映射传递到表达式包装器fn中来完成。 例如，如果表达式为增量（金额），则可以通过将localFn调用为localFn（{amount：22}）来指定金额值。
2 个解决方案
解决方案1
1 2015-09-23 09:40:56
您可以在指令中使用&运算符，可以使用以下指令：
HTML：
<div ng-app="myApp" >
<drink flavor="ctrlFlavor" ng-init="ctrlFlavor = 'blackberry'"> </drink>
<span>Flavor={{ctrlFlavor}}</span>
</div>
请注意，您可以根据需要初始化ctrlFlavor，可以在ng-init块中或在controller ng-init ，如下面的JSFiddle所示。
JS：
var app = angular.module('myApp', []);
app.directive("drink", function () {
return {
scope: {
flavor: "&"
},
template: '<input value="{{flavor()}}"/>',
};
});
特别注意{{flavour()} 。 魔术在于它返回一个函数，因此您无法设置该值。
小提琴： http : //jsfiddle.net/sgx8zdxc/
您可以使用它，并注意更改输入中的值（显然）将使值仅保留在父作用域中。 另外，我也不认为您可以执行ngModel='flavor()' 。
解决方案2
0 2015-09-23 09:54:40
单向绑定的示例：
<body ng-app ng-init="firstName = 'John'; lastName = 'Doe';">
<strong>First name:</strong> {{firstName}}<br />
<strong>Last name:</strong> <span ng-bind="lastName"></span>
</body>
</html>
一种方法是数据绑定，因为模型值（此处的变量表示模型）会自动分配给通过数据绑定符号指定的HTML占位符元素，但HTML元素不会更改模型中的值（一种方法）。
具有单向绑定的Angular 1.5指令可更新父范围
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.