Aviso: actualizo esta respuesta a medida que encuentro mejores soluciones. También mantengo las viejas respuestas para referencia futura siempre que sigan relacionadas. La última y mejor respuesta es lo primero.
Mejor respuesta
Las directivas en angularjs son muy poderosas, pero lleva tiempo comprender qué procesos hay detrás de ellas.
Al crear directivas, angularjs le permite crear un ámbito aislado con algunos enlaces al ámbito primario. Estos enlaces están especificados por el atributo que adjunta el elemento en DOM y cómo define la propiedad del alcance en el objeto de definición de directiva .
Hay 3 tipos de opciones de enlace que puede definir en alcance y las escribe como atributo relacionado con prefijos.
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>
En ese caso, en el ámbito de la directiva (ya sea en función de enlace o controlador), podemos acceder a estas propiedades de esta manera:
/* 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 .
"Aún está bien" Respuesta:
Dado que esta respuesta fue aceptada, pero tiene algunos problemas, la actualizaré a una mejor. Aparentemente, $parse
es un servicio que no reside en las propiedades del alcance actual, lo que significa que solo toma expresiones angulares y no puede alcanzar el alcance.
{{
, las }}
expresiones se compilan mientras se inicia angularjs, lo que significa que cuando intentamos acceder a ellas en nuestro postlink
método de directivas , ya están compiladas. (ya {{1+1}}
está 2
en la directiva).
Así es como te gustaría usar:
var myApp = angular.module('myApp',[]);
myApp.directive('myDirective', function ($parse) {
return function (scope, element, 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>
Una cosa que debe notar aquí es que, si desea establecer la cadena de valor, debe ajustarla entre comillas. (Ver tercera entrada)
Aquí está el violín para jugar: http://jsfiddle.net/neuTA/6/
Vieja respuesta:
No estoy eliminando esto para las personas que pueden ser engañadas como yo, tenga en cuenta que usar $eval
está perfectamente bien la forma correcta de hacerlo, pero $parse
tiene un comportamiento diferente, probablemente no necesite usarlo en la mayoría de los casos.
La forma de hacerlo es, una vez más, usando scope.$eval
. No solo compila la expresión angular, sino que también tiene acceso a las propiedades del ámbito actual.
var myApp = angular.module('myApp',[]);
myApp.directive('myDirective', function () {
return function (scope, element, attr) {
element.val("value = "+ scope.$eval(attr.value));
}
});
function MyCtrl($scope) {
}
Lo que te estás perdiendo fue $eval
.
http://docs.angularjs.org/api/ng.$rootScope.Scope#$eval
Ejecuta la expresión en el ámbito actual que devuelve el resultado. Cualquier excepción en la expresión se propaga (sin capturar). Esto es útil al evaluar expresiones angulares.