Referenzrichtlinie Attribut mit vm statt $ scope

Question

ich eine benutzerdefinierte Richtlinie haben, die wie folgt aussieht:

<my-queue id="report.id" version="report.version"></my-queue> 

Meiner Richtlinie Definition Objekt verweisen ich mein Controller und Umfang in etwa so:

controller: 'QueueController', 
controllerAs: 'myQueue', 
scope: { 
    id: '=', 
    version: '=' 
} 

In meinem Controller setze ich var vm = this so kann ich auf Scope-Variablen als vm.variable beziehen. Dies funktioniert jedoch nicht für id und version. Ich habe festgestellt, dass ich $scope injizieren muss und diese Eigenschaften als $scope.id und $scope.version referenzieren. Gibt es eine Möglichkeit, dies einzurichten, so dass ich vermeiden kann, $scope zu injizieren und konsistent mit dem Rest meines Controllers zu bleiben, indem ich auf vm.id und vm.version referenziere?

Answer 1

Die controllerAs Eigentum auf Ihrer Richtlinie Config Objekt sein wird, was Sie zu Ihrem Controller-Instanz verweisen verwenden, wenn Sie also vm in Ihrer Vorlage verwenden möchten, werden Sie die controllerAs Eigenschaft auf vm einstellen müssen. Auch indem Sie die bindToController Eigenschaft auf true Einstellung, die Sie direkt mit dem View-Modell statt $ Umfang binden können:

function myQueue() { 
    return { 
     restrict: 'E', 
     template: ... , 
     controller: myQueueCtrl, 
     controllerAs: 'vm', 
     scope: { 
      id: '=', 
      version: '=' 
     }, 
     bindToController: true 
    } 
} 

Mit Ihrer aktuellen Richtlinie Konfiguration Ihre controllerAs Referenz wird unter myQueue, nicht vm, was bedeutet, alle Eigenschaften, die Sie Erstellen Sie auf Ihrem vm (zB vm.id) in Ihrer Steuerung wird auf myQueue in Ihrer Vorlage (zB myQueue.id).

Durch bindToController Hinzufügen wir nicht brauchen, um $ Umfang in der Steuerung Richtlinie zu injizieren:

function QueueController() { 
    var vm = this; 
} 

Dann können Sie Ihre Vars in der Richtlinie Vorlage als

{{vm.id}} 
{{vm.version}} 

Es gibt eine Plunker verweisen here Ihrer Direktive mit bindToController auf True und controllerAs auf vm festgelegt.