2013-10-17 7 views
34

Ich möchte mein ng-Modell von der 'äußeren-Direktive' zu einer 'inner-direktive' (die in der äußeren Direktiven-Vorlage enthalten ist) übergeben.Übergeben von ng-Modell in geschachtelten Direktiven

Was ist der richtige Weg dafür?

HTML-Code:

<body> 
    <outer-directive ng-model="prop" /> 
</body> 

und Richtlinie Code:

angular.module('app', []).directive('outerDirective', function(){ 
    return { 
     template: '<inner-directive ng-model="prop" />', 
     link: function() { ... } 
    } 
}); 
+1

Sehr intuitiv: http://jsfiddle.net/cherniv/UAvaB/ – Cherniv

Antwort

44

Sie können eine bidirektionale Bindung aufgebaut (siehe documentation im Abschnitt "Richtlinie Definition Object") mit den Variablen in ngModel Attribut wie bei allen anderen Direktiven:

<my-directive ng-model="foo"></my-directive> 
myApp.directive('myDirective', function() { 
    return { 
     template: '<div><input type="text" ng-model="ngModel" /></div>', 
     replace: true, 
     scope: { 
      ngModel : '=', 
     }, 
    }; 
}); 

Fiddle

+3

Vielen Dank! Es funktioniert wunderbar Ich glaubte nicht, dass es so einfach wäre, also probierte ich einige schreckliche Dinge mit jquery in der Link-Funktion, die keiner von ihnen funktionierte ... – user2794782

+5

Dies ist nicht das Problem des äußeren Modells ist '$ unberührte = true' und das Eingabemodell '$ dirty = true'. Gibt es eine Möglichkeit, diese Änderungen des Validierungsstatus auf das 'ng-Modell' auf Anweisungsebene zu übertragen? – jusopi

+2

Dies funktioniert nicht, wenn die Direktiven in späteren eckigen Versionen einen isolierten Bereich haben. –

0

Ich glaube, Sie müssen das Formular in der Richtlinie zu übergeben und stellen Sie die Form schmutzig manuell

<directive directive-form="editForm" ></directive> 

scope: { 
directiveForm:"=" 
}, 
link: function (scope, $elem, $attrs) 
{ 
    scope.directiveForm.$setDirty(); 
} 
Verwandte Themen