Avviso: aggiorno questa risposta quando trovo soluzioni migliori. Conservo anche le vecchie risposte per riferimento futuro, purché rimangano correlate. La risposta più recente e migliore viene prima di tutto.
Risposta migliore:
Le direttive in angularjs sono molto potenti, ma ci vuole tempo per capire quali processi si nascondono dietro di esse.
Durante la creazione delle direttive, angularjs consente di creare un ambito isolato con alcuni vincoli all'ambito padre. Questi attacchi sono specificati dal dell'attributo si collega l'elemento di DOM e come si definisce ambito proprietà nel oggetto di definizione direttiva .
Esistono 3 tipi di opzioni di rilegatura che è possibile definire nell'ambito e si scrivono come attributo relativo ai prefissi.
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>
In tal caso, nell'ambito della direttiva (sia che si tratti della funzione di collegamento o del controller), possiamo accedere a queste proprietà in questo modo:
/* 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 .
"Ancora OK" Risposta:
Poiché questa risposta è stata accettata, ma presenta alcuni problemi, la aggiornerò con una migliore. Apparentemente, $parseè un servizio che non risiede nelle proprietà dell'ambito attuale, il che significa che accetta solo espressioni angolari e non può raggiungere l'ambito.
{{, le }}espressioni vengono compilate durante l'avvio di angularjs, il che significa che quando proviamo ad accedervi nel nostro postlinkmetodo delle direttive , sono già compilate. ( {{1+1}}è 2già in direttiva).
Ecco come vorresti usare:
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 che dovresti notare qui è che, se vuoi impostare la stringa di valore, dovresti racchiuderla tra virgolette. (Vedi 3 ° input)
Ecco il violino con cui giocare: http://jsfiddle.net/neuTA/6/
Vecchia risposta:
Non lo sto rimuovendo per le persone che possono essere fuorviate come me, nota che usare $evalva benissimo il modo corretto di farlo, ma $parseha un comportamento diverso, probabilmente non avrai bisogno di questo da usare nella maggior parte dei casi.
Il modo per farlo è, ancora una volta, usare scope.$eval. Non solo compila l'espressione angolare, ma ha anche accesso alle proprietà dell'ambito corrente.
var myApp = angular.module('myApp',[]);
myApp.directive('myDirective', function () {
return function (scope, element, attr) {
element.val("value = "+ scope.$eval(attr.value));
}
});
function MyCtrl($scope) {
}
Quello che ti mancava era $eval.
http://docs.angularjs.org/api/ng.$rootScope.Scope#$eval
Esegue l'espressione sull'ambito corrente restituendo il risultato. Eventuali eccezioni nell'espressione vengono propagate (non rilevate). Ciò è utile per valutare le espressioni angolari.