@Input 속성이 각도 2의 onInit에서 정의되지 않습니다.

@Input 속성이 각도 2의 onInit에서 정의되지 않습니다.

---

생성자 또는 ngOnInit에서 구성 요소의 @Input 값을 가져 오려고합니다. 그러나 그것은 항상 "정의되지 않은"것으로오고있다.

문제를 표시하기 위해 console.log로 hero plunker를 업데이트했습니다 (베타 각도). http://plnkr.co/edit/dseNM7OTFi1VNG2Z4Oj5?p=preview

export class HeroDetailComponent implements OnInit {
  constructor(){
    console.log('hero', this.hero)
  }
  public hero: Hero;

  ngOnInit() {
    console.log('hero', this.hero)
  }
}

내가 여기서 뭘 잘못하고 있니?

---

되지 않은 이유 정의 ngOnInit는 구성 요소가 초기화 된 지점에서 실제로 Heroobject-를 전달하지 않았기 때문입니다.

<my-hero-detail [hero]="selectedHero"></my-hero-detail>

이 시점 selectedHero에서 귀하의 가치가 평가 AppComponent목록의 클릭 이벤트가 onSelect메소드를 호출 할 때까지

편집 : 내가 실제로 수정을 제공하지 않았다는 것을 깨달았습니다. 당신은을 추가하는 경우 ngIf에my-hero-detail

<my-hero-detail *ngIf="selectedHero" [hero]="selectedHero"></my-hero-detail>

이렇게하면 my-hero-detail구성 요소 의 초기화가 지연 되고 콘솔 출력이 표시됩니다. 이 습관은 출력 할 때 다시 선택한 영웅이 변경됩니다.

---

이것은 처음으로 발생하는 오류입니다. 그러나 선택이 지정하신 Hero는 정의 된 값과 함께 세부 정보보기로 전달됩니다.

기본적으로 원래 값 (정의되지 않음)을 기반으로 onInit 호출이 표시됩니다.

다음과 같이 선택할 수 있습니다.

export class HeroDetailComponent implements AfterViewChecked {
  constructor(){
    console.log('hero', this.hero)
  }
  public hero: Hero;

  ngAfterViewChecked() {
    console.log('hero', this.hero)
  }
}

---

에서 입력 속성 값을 정의하지 않을 때 갑자기 동작이 발생했습니다 ngOnInit. *ngIf="selectedHero"HTML 코드 의 광고는 나를 만족 스럽습니다. 또한, 사용 AfterViewChecked에서 THG의 대답 @ 대답 주기적으로 호출하고 경고가 발생하기 때문에, 나를 위해 좋은 해결이 아니었다 ExpressionChangedAfterItHasBeenCheckedError나는 ( 내가 사용 문제를 해결하지 않았고 어떤 변수를 변경하고자 setTimeout합니다.) 이것이 문제에 대한 나의 해결책입니다.

export class MyComponent implements OnChanges {
    @Input() myVariable: any;

    ngOnChanges(changes: SimpleChanges) {
        if (changes['myVariable']) {
            let variableChange = changes['myVariable'];
            //do something with variableChange.currentValue
        }
    }
}

나중에 누군가에게 도움이되기를 바랍니다.

---

ngOninit 메서드 사용에서

ngOnInit() {
    if(this.hero) 
        console.log('hero', this.hero);
}

참고 URL : https://stackoverflow.com/questions/34396684/input-property-is-undefined-in-angular-2s-oninit