Angular2訪問@Input從構造函數中調用服務的類

Question

我是Angular2和Typescript的新手。我試圖從我的類的構造函數獲取@Input。一個服務在構造函數中被調用，我需要傳遞一個參數。

@Component({ 
    selector:'side-menu', 
    templateUrl:'menu.html', 
    providers: [MenuService] 
}) 

export class SideMenuComponent { 
    @Input() blockType; 

    menuItems 

    constructor(menuService:MenuService){ 
     this.menuItems = menuService.getMenuItems(this.blockType); // Sends Undefined 
     this.menuItems = menuService.getMenuItems('HardCodedString'); //This works 
    } 


} 

，這是我的服務

@Injectable() 

export class MenuService { 
    getMenuItems(type) { 
     console.log(type) 

     switch(type){ 
      case 'Thing': 

       return []; 
       break; 
      case 'Otherthing': 
       return []; 
       break; 
      default: 
       return []; 


     } 

    } 
} 

我如何能保證@input被髮送到服務？

Answer 1

當構造函數被調用時，輸入尚未設置。改爲將構造函數代碼移動到ngOnInit()。

@Component({ 
    selector:'side-menu', 
    templateUrl:'menu.html', 
    providers: [MenuService] 
}) 

export class SideMenuComponent { 
    @Input() blockType; 

    menuItems 

    constructor(private menuService:MenuService){} 

    ngOnInit() { 
     this.menuItems = this.menuService.getMenuItems(this.blockType); // Sends Undefined 
     this.menuItems = this.menuService.getMenuItems('HardCodedString'); //This works 
    } 
} 

每次@Input() s的更新ngOnChanges()被調用。
ngOnInit()在ngOnChanges()之後被稱爲第一次。