Ho una direttiva all’interno di un ng-repeater che dovrebbe impostare una proprietà scope. Si prega di vedere il violino qui: http://jsfiddle.net/paos/CSbRB/
Il problema è che la proprietà scope è data come un valore di attributo come questo:
La direttiva dovrebbe impostare la proprietà scope inputdata.title su una stringa. Questo non funziona:
app.directive('ngUpdate1', function() { return function(scope, element, attrs) { element.bind('click', function() { scope.$apply(function() { scope[ attrs.ngUpdate1 ] = "Button 1"; }); }); }; });
Tuttavia, l’assegnazione funziona direttamente:
scope["inputdata"]["title"] = "Button 1";
Puoi dirmi come posso impostare una proprietà di scope con. notazione nel suo nome da una direttiva?
PS: Il motivo per cui il violino sta usando un ripetitore è perché rende le direttive in ambito figlio. Quando si trovano in un ambito figlio, non è ansible scrivere sulle proprietà dell’ambito che sono primitive. Ecco perché ho bisogno di una proprietà dell’object con “.” nel nome. Vedi la lunga spiegazione qui: Quali sono le sfumature dell’eredità prototipo / prototipo dell’oscilloscopio in AngularJS?
Grazie
$ parse risolverà il tuo problema.
app.directive('ngUpdate1', function($parse) { return function(scope, element, attrs) { var model = $parse(attrs.ngUpdate1); console.log(model(scope)); // logs "test" element.bind('click', function() { model.assign(scope, "Button 1"); scope.$apply(); }); }; });
Violino
Ogni volta che una direttiva non utilizza un ambito isolato e si specifica una proprietà dell’ambito utilizzando un attributo e si desidera modificare il valore, utilizzare $parse
.
Se non è necessario modificare il valore, è ansible utilizzare $eval
invece:
console.log(scope.$eval(attrs.ngUpdate1));
Non sei sicuro di quale sia l’objective generale, ma un modo è creare 2 attributi, uno per l’object di destinazione e l’altro per la proprietà di tale object:
app.directive('ngUpdate1', function() { return function(scope, element, attrs) { element.bind('click', function() { scope.$apply(function() { scope[ attrs.obj ][attrs.prop] = "Button 1"; }); }); }; });
DEMO: http://jsfiddle.net/CSbRB/9/
In alternativa, utilizzando il formato esistente puoi split()
valore dell’attuale attributo ng-update1
e usare la matrice di risultati per object e proprietà nella notazione
element.bind('click', function() { var target=attrs.ngUpdate1.split('.'); scope.$apply(function() { scope[ target[0] ][target[1]] = "Button 1"; }); });
DEMO con entrambi gli approcci: http://jsfiddle.net/CSbRB/10/
Un altro approccio in cui si crea un ambito isolato in direttiva e si può passare il riferimento all’object inputdata
e il nome della proprietà pull da attributo (stesso markup della seconda versione):
app.directive('ngUpdate3', function () { return { scope: { targetObject: '=obj' }, link: function (scope, element, attrs) { element.bind('click', function () { scope.$apply(function () { scope.targetObject[attrs.prop]='Button 3'; }); }); } } });