我创建了this jsFiddle来详细说明。
<div ng-controller="MyCtrl"> <input my-directive value="123"> <input my-directive value="{{1+1}}"> </div> myApp.directive('myDirective',function () { return function (scope,element,attr) { element.val("value = "+attr.value); } });
我缺少什么?
更好的答案:
angularjs中的指令非常强大,但是需要时间来理解哪些进程在它们后面。
在创建指令时,angularjs允许您创建一个与父作用域有一些绑定的孤立作用域。这些绑定由您在DOM中附加元素的属性指定,以及如何在指令定义对象中定义scope属性。
有3种类型的绑定选项,您可以在范围中定义它们,并将它们作为前缀相关属性写入。
angular.module("myApp",[]).directive("myDirective",function () { return { restrict: "A",scope: { text: "@myText",twoWayBind: "=myTwoWayBind",oneWayBind: "&myOneWayBind" } }; }).controller("myController",function ($scope) { $scope.foo = {name: "Umur"}; $scope.bar = "qwe"; });
HTML
<div ng-controller="myController"> <div my-directive my-text="hello {{ bar }}" my-two-way-bind="foo" my-one-way-bind="bar"> </div> </div>
在这种情况下,在指令的范围(无论是在链接函数还是控制器),我们可以访问这些属性,如下所示:
/* Directive scope */ in: $scope.text out: "hello qwe" // this would automatically update the changes of value in digest // this is always string as dom attributes values are always strings in: $scope.twoWayBind out: {name:"Umur"} // this would automatically update the changes of value in digest // changes in this will be reflected in parent scope // in directive's scope in: $scope.twoWayBind.name = "John" //in parent scope in: $scope.foo.name out: "John" in: $scope.oneWayBind() // notice the function call,this binding is read only out: "qwe" // any changes here will not reflect in parent,as this only a getter .
“仍然OK”答案:
因为这个答案被接受了,但有一些问题,我要更新一个更好的。显然,$ parse是一个不在当前范围的属性中的服务,这意味着它只使用角度表达式,不能到达范围。
{{,}}表达式是在angularjs启动时编译的,这意味着当我们尝试在我们的指令postlink方法中访问它们时,它们已经被编译。 ({{1 1}}已经是2的指令)。
这是你想要使用的方式:
var myApp = angular.module('myApp',[]); myApp.directive('myDirective',function ($parse) { return function (scope,attr) { element.val("value=" + $parse(attr.myDirective)(scope)); }; }); function MyCtrl($scope) { $scope.aaa = 3432; }
。
<div ng-controller="MyCtrl"> <input my-directive="123"> <input my-directive="1+1"> <input my-directive="'1+1'"> <input my-directive="aaa"> </div>
你应该注意到的一件事是,如果你想设置值字符串,你应该用引号包装。 (见第三个输入)
这里是玩弄的小提琴:http://jsfiddle.net/neuTA/6/
老答案:
我不会删除这个可以被误导像我一样的人,注意使用$ eval是完全正确的方法,但$ parse有不同的行为,你可能不需要这个在大多数案件。
方法是,再次使用scope。$ eval。它不仅编译角度表达式,还可以访问当前范围的属性。
var myApp = angular.module('myApp',attr) { element.val("value = "+ scope.$eval(attr.value)); } }); function MyCtrl($scope) { }
你缺少的是$ eval。
07001
Executes the expression on the current scope returning the result. Any exceptions in the expression are propagated (uncaught). This is useful when evaluating angular expressions.