角1.5组件和babel

Question

所以，我试图使用1.5组件功能，但用胖箭头编码。我使用巴贝尔来构建系统

我的部件，精简到最低限度，以显示我的问题是这样的：

angular.module('myApp') 
    .component('myComponent', { 
     controller:() => { 
      this.$onInit =() => {}; 
     }, 

     template: `<p>foobar1</p>` 
    }); 

当我尝试加载这个组件，我得到一个错误抱怨

typeError: Cannot set property '$onInit' of undefined 

所以，当我看到在铬devtools来源，我看到

angular.module('myApp').component('myComponent', { 
/** @ngInject */ 
controller: function controller() { 
    undefined.$onInit = function() {}; 
}, 
template: '<p>foobar1</p>' 

}）;

我希望，我已经做了非常错误的，但不能看到它;）

任何人有任何建议吗？

谢谢

Answer 1

Angular为每个组件创建控制器的新实例。在ES5中，我们没有类，所以我们在这里传递构造函数。

但ES6我们有一流的，所以你可以用它代替

let myComponent = { 
    controller: myComponentController, 
    template: `<p>foobar1</p>` 
}; 

class myComponentController{ 
    constructor() { 
    this.answer = 41; 
    } 
    $onInit() { 
    this.answer++; 
    } 
}; 

angular.module('myApp') 
    .component('myComponent', myComponent); 

帕斯卡也写过一些有关在这里：http://blog.thoughtram.io/angularjs/es6/2015/01/23/exploring-angular-1.3-using-es6.html