mit ControllerAs in einem Winkel 1.5 Komponente

Question

Ich versuche, die controllerAs Syntax in einem angularjs 1.5 Komponente zu verwenden.

hier ist ein Plunker https://plnkr.co/edit/mTa1bvoNi1Qew9l1xAFS?p=preview

ohne die controllerAs alles funktioniert.

(function() { 
    angular.module("myApp", []) 
    .component("helloWorld", { 
     template: "Hello {{$ctrl.name}}, I'm {{$ctrl.myName}}!", 
     bindings: { 
     name: '@' 
     }, 
     controller: helloWorldController 
    }) 

    function helloWorldController() { 
    /* jshint validthis: true */ 
    var vm = this; 
    vm.myName = 'Alain' 
    } 
})(); 

jedoch versuchen, controllerAs und ich die Bindungen bekommen nicht mehr zu ändern.

(function() { 
    angular.module("myApp", []) 
    .component("helloWorld", { 
     template: "Hello {{vm.name}}, I'm {{vm.myName}}!", 
     bindings: { 
     name: '@' 
     }, 
     controller: ('helloWorldController', helloWorldController) 
    }) 

    function helloWorldController() { 
    /* jshint validthis: true */ 
    var vm = this; 
    vm.myName = 'Alain' 
    } 
})(); 

Answer 1

Sie sollten die controllerAs als Eigenschaft, wie folgt angeben:

(function() { 
    angular.module("myApp", []) 
    .component("helloWorld", { 
     template: "Hello {{vm.name}}, I'm {{vm.myName}}!", 
     bindings: { 
     name: '@' 
     }, 
     controller: ('helloWorldController', helloWorldController), 
     controllerAs: 'vm' 
    }) 

    function helloWorldController() { 
    /* jshint validthis: true */ 
    var vm = this; 
    vm.myName = 'Alain' 
    } 
})(); 

https://plnkr.co/edit/ThIvAnLJFhucckcRvQ3N?p=preview

Für weitere Informationen: https://alexpeattie.com/blog/setting-the-default-controlleras-to-vm-for-component-angular-1-5