Neden aşağıdaki örnekte $ onInit yöntemi kullanılmıyor?

Question

Açısal bileşen bileşenini kullanmak isterim, ancak bir şey yanlış görünüyor. Bir süre bu kodu kontrol ettim. Yazım hatası yok, belgelere uyuyor gibi görünüyor, ancak hala çalışmıyor.

checked var, Açısal 1.5.3 yüklendi.

Konsolda çıkış yok. documentation ve this blog girişine göre "onInit" metnini görmeliyim.

Bileşenin şablonu doğru şekilde görüntüleniyor ve şablonun yüklü olduğunu görebiliyorum, ancak denetleyicinin başlatılmadığı/tetiklenmediği anlaşılıyor.

Uygulamam, Typescript'te yazılmıştır.

bileşeni:

module sayusiando.dilib.spa { 

    export class LeftHandMenuComponent implements ng.IComponentOptions { 

     public transclude: boolean = false; 
     public controller: Function = LeftHandMenuController; 
     public controllerAs: string = "vm"; 
     public templateUrl: string = "app/layout/leftHandMenu/leftHandMenuTemplate.html"; 

    } 

    angular 
     .module("dilib") 
     .component("dilibLeftHandMenu", new LeftHandMenuComponent()); 
} 

derlenmiş kod:

var sayusiando; 
(function (sayusiando) { 
    var dilib; 
    (function (dilib) { 
     var spa; 
     (function (spa) { 
      var LeftHandMenuComponent = (function() { 
       function LeftHandMenuComponent() { 
        this.transclude = false; 
        this.controller = spa.LeftHandMenuController; 
        this.controllerAs = "vm"; 
        this.templateUrl = "app/layout/leftHandMenu/leftHandMenuTemplate.html"; 
       } 
       return LeftHandMenuComponent; 
      })(); 
      spa.LeftHandMenuComponent = LeftHandMenuComponent; 
      angular 
       .module("dilib") 
       .component("dilibLeftHandMenu", new LeftHandMenuComponent()); 
     })(spa = dilib.spa || (dilib.spa = {})); 
    })(dilib = sayusiando.dilib || (sayusiando.dilib = {})); 
})(sayusiando || (sayusiando = {})); 

Düzeni şablonu:

<div> 
    <dilib-left-hand-menu class="col-lg-2"></dilib-left-hand-menu> 
</div> 

LeftHandMenuController:

module sayusiando.dilib.spa { 
    "use strict"; 

    export interface ILeftHandMenuController { 
    } 


    export class LeftHandMenuController implements ILeftHandMenuController { 

     $onInit: Function = (() => {console.log("onInit");}); 


     static $inject = ["LeftHandMenuService"]; 
     constructor(leftHandMenuService: sayusiando.dilib.spa.ILeftHandMenuService) { 

      console.log("con"); 
      this.leftHandMenuService = leftHandMenuService; 

      //this.activate(); 
      console.log("construct"); 
     } 

     activate() { //activate logic } 

    } 

    angular 
     .module('dilib') 
     .controller('leftHandMenuController', LeftHandMenuController); 

} 

Derleyen kontrolör kodu:

var sayusiando; 
(function (sayusiando) { 
    var dilib; 
    (function (dilib) { 
     var spa; 
     (function (spa) { 
      "use strict"; 
      var LeftHandMenuController = (function() { 
       function LeftHandMenuController(leftHandMenuService) { 
        this.$onInit = (function() { console.log("onInit"); }); 
        console.log("con"); 
        this.leftHandMenuService = leftHandMenuService; 
        //this.activate(); 
        console.log("construct"); 
       } 
       LeftHandMenuController.prototype.activate = function() { 
        var _this = this; 
        this.leftHandMenuService.getLeftHandMenu() 
         .then(function (result) { 
         _this.leftHandMenu = result; 
        }); 
       }; 
       LeftHandMenuController.$inject = ["LeftHandMenuService"]; 
       return LeftHandMenuController; 
      })(); 
      spa.LeftHandMenuController = LeftHandMenuController; 
      angular 
       .module('dilib') 
       .controller('leftHandMenuController', LeftHandMenuController); 
     })(spa = dilib.spa || (dilib.spa = {})); 
    })(dilib = sayusiando.dilib || (sayusiando.dilib = {})); 
})(sayusiando || (sayusiando = {})); 

Answer 1

$ Oninit'i yanlış bir şekilde aradım. cevap için

module sayusiando.dilib.spa { 
    "use strict"; 

    export interface ILeftHandMenuControllerScope { 

    } 


    export class LeftHandMenuController implements ILeftHandMenuControllerScope { 

     public leftHandMenu: Array<sayusiando.dilib.spa.IModuleContract>; 

     static $inject = ["leftHandMenuService"]; 
     constructor(
      private leftHandMenuService: sayusiando.dilib.spa.ILeftHandMenuService) { 

     } 


     public $onInit =() => { 

      this.leftHandMenuService.getLeftHandMenu() 
       .then((result: Array<sayusiando.dilib.spa.IModuleContract>): void => { 
        this.leftHandMenu = result; 
       }); 

     } 

    } 

    angular 
     .module('dilib') 
     .controller('leftHandMenuController', LeftHandMenuController); 

} 

Answer 2

Bu modül tanım bağımlılık parametre listesi eksik nedeniyle olduğunu düşünüyorum. İkinci ifade hiçbir bağımlılıkları ile bir modül dilib oluşturmaya çalışır oysa

angular.module("dilib") 
angular.module("dilib",[]) 

ilk açıklamada, adı dilib ile mevcut bir modülü erişmeye çalıştığında: Bu iki tablolara bir fark yoktur. Yeni bir modül oluşturmaya çalıştığınıza inanıyorum ve bu nedenle ikinci formata ihtiyaç duyacaksınız.