相关疑难解决方法(0)

此示例显示如何在子组件上使用@Input()批注.我的问题是你如何在根组件上使用它？例如,如果您修改上面链接上的代码:

@Component({
selector: 'app',
template: `
    <bank-account bank-name="RBC" account-id="4747"></bank-account>
`,
directives: [BankAccount]
})
class App {
    @Input() something: string;
}

bootstrap(App);

并在HTML中:

<app something="Test"></app>

上面的示例永远不会更新App组件上的某些属性.

首先,如果这是一个可怕的设计,我很乐意改变.

在我index.html的身体中,有:

<month [year]="2016" [monthOfYear]="4">Loading...</month>

month.component.ts 那么:

import { Component, Input, OnInit } from '@angular/core';
import { DayComponent } from '../day/day.component';
import * as Models from '../../../models/_models';

@Component({  
  selector: 'month',
  moduleId: module.id,
  templateUrl: 'month.component.html',
  styleUrls: ['month.component.css'],
  directives: [DayComponent]
})

export class MonthComponent {  
  name: string;
  days: Models.Day[];
  @Input('year') year: number;
  @Input('monthOfYear') monthOfYear: number;
  month: Models.Month;

  ngOnInit() {
    this.month = new Models.Month(this.year, this.monthOfYear);
    this.name = this.month.getMonthName();
    this.days = this.month.days;
  }
}

...... ngOnInit()并被正确地称呼.然而,在调用(或许永远,但我不知道如何来确定),两者的时间year和monthOfYear是undefined …