Angular 1.5 $ onInit不觸發-打字稿

Question

我正在嘗試將Angular 1.5應用程序的一部分轉換為TypeScript。 我沒有收到任何錯誤，但是$ onInit（）方法不再觸發。 我包括了有效的代碼（JavaScript）和無效的代碼（TypeScript）

JavaScript版本（有效）：

angular
    .module('app')
    .component('appProductList', {
        templateUrl: '/src/product-list/product-list.component.html',
        controller: ProductListController
    });

function ProductListController($location, ProductService) {
    var ctrl = this;

    ctrl.$onInit = init;
    ctrl.selectProduct = selectProduct;

    function init(){
        ctrl.products = [];

        ProductService.getProducts()
            .then(res => {
                ctrl.products = res.data;
            }, error => console.log(error));
    }

    function selectProduct(product){
        $location.path('/product/' + product.id);
    }
}

TypeScript版本（$ onInit永遠不會觸發）：

angular
    .module('app')
    .component('appProductList', {
        templateUrl: '/src/product-list/product-list.component.html',
        controller: ProductListController
    });

class ProductListController{
    products: Array<Product>;

    constructor(private $location: ng.ILocationService, 
                private ProductService: ProductService) {}

    $onInit() {
        this.products = new Array<Product>();

        this.ProductService.getProducts()
            .then((res: ng.IHttpPromiseCallbackArg<Array<Product>>) => {
                this.products = res.data;
            }, error => console.log(error));
    } 

    selectProduct(product){
        this.$location.path('/product/' + product.id);
    }
} 

Answer 1

答案是，類不能吊起，因此必須在引用它們之前聲明它們。

從MDN文檔中：

吊裝：函數聲明和類聲明之間的重要區別在於，函數聲明是懸掛的，而類聲明不是。 您首先需要聲明您的類，然后訪問它，否則類似以下的代碼將引發ReferenceError：

MDN：課程