2013-08-28 17 views
9

Jeśli używam izolowanego zakresu, mogę przekazać zmienną nad atrybutem.Angularjs przekazuje zmienne do dyrektywy z dziedziczonym (nie izolowanym) zakresem

tj

<my-directive baz='foo.bar'> 

następnie w dyrektywie JavaScript

.directive('myDirective', function() { 
    return { 
    scope: { 
     'baz': '=' 
    } 
    } 
}); 

Czy istnieje jakiś sposób, aby zrobić coś podobnego z dziedziczną zakresie? Funkcja łącza po prostu przekazuje ciągi.

W tej chwili sam parsuję zmienną i dopasowuję ją do zakresu. $ Parent. Wygląda na to, że powinna istnieć funkcja pomocnicza lub łatwiejszy sposób na zrobienie tego.

+0

Masz na myśli dostęp do nadrzędnego zakresu z kodu dyrektywy? –

Odpowiedz

14

Zastosowanie $eval lub $parse:

<my-directive baz='foo.bar'> 

.directive('myDirective', function($parse) { 
    return { 
    scope: true, 
    link: function(scope, element, attrs) { 
     console.log(scope.$eval(attrs.baz)); 
     var model = $parse(attrs.baz); 
     console.log(model(scope)); 
     // if you want to modify the value, use the model, not $eval: 
     model.assign(scope, "new value"); 
    } 
    } 
}); 
+0

Nie wiedziałem o analizie $ $. To dobry sposób na zrobienie tego. – BoxerBucks

0

Jeśli nie deklarują obiektu zakresu w dyrektywie, nie będzie odizolowany setup zakres, a otrzymasz dostęp do zakres, który jest przekazywany z miejsca, gdzie div jest zadeklarowany w DOM.

coś takiego:

.directive('myDirective', function() { 
    return { 
    function(scope, element, attrs){ 
     //scope here = the inherited scope from the DOM 
    } 
} 

Więc jeśli masz dyrektywy zadeklarowane w znaczniku DIV, nie trzeba faktycznie wysłać wartości jako atrybut - można po prostu wyciągnąć go z zakres.

3

z tym kodem:

link: function(scope, elem, attrs) {} 

można użyć

attrs 

element, aby uzyskać wszystkie ATUTY przypisać do tej dyrektywy.

następnie można w prosty sposób przypisać attrs do dowolnego zakresu i użyć go w swoim e.x templae.

scope.someValue = attrs.attrName; 

Podsumowując:

dyrektywa:

link: function(scope, elem, attrs) { 
     scope.someValue = attrs.attrName; 
    } 

dyrektywa szablon:

<div> {{someValue}} <div> 

dyrektywa wezwanie

<my-directive attrName="foo"> </my-directive> 
+0

to będzie działać tylko z ciągami znaków i może boolami itp., A nie obiektami, które prawdopodobnie będą problematyczne. – Millenjo

Powiązane problemy