는 방법을 사용하여 검색된 데이터에서는 관찰에서 자신의 구성 요소를 반환 정의되지 않은 때로 사용되는 입력()

내 템플릿을 생성 example.component.html 을 받는 방법으로 변수를 클릭 액션:

<div>
  <button (click)="method()">click here</button>
</div>

에 example.component.ts 파일,방법에서 온 입(),그래서 나는 이 템플릿을 사용할 수 있습니다에 여러 상황:

@Component({
  selector: 'example',
  templateUrl: './example.component.html',
})
    export class ExampleComponent implements OnInit {
      @Input() method;
    
      constructor() {}
    
      ngOnInit(): void {}
    }

여기에 갈수록 복잡합니다. 에서 상위 구성요소,방법이 발생됩니다 클릭에 사용하는 변수에서 오는 observable:

parent-example.component.html

  <example [method]="onClick"></example>

parent-example.component.ts

@Component({
  selector: 'parent-example',
  templateUrl: './parent-example.component.html',
})
export class ParentExampleComponent implements OnInit {
  @Input() method;
  business;

  constructor(businessEntityService: BusinessEntityService) {
    businessEntityService.entities$.subscribe(
      data => (this.business = data),
    );
  }

  onClick() {
    console.log(this.business);
  }

  ngOnInit(): void {}
}

도 상위 구성요소가 구독 businessEntityService 관찰했을 확인 그것은 사실에 데이터을 때,나는 버튼을 클릭하면 콘솔 로그 undefined.

이는 아마와 함께 할 수 있는 범위와 스고 this.business 어린이 구성 요소,그러나 나는 사랑을 알고 있으면 어쨌든 전화하는 방법을 사용하는 변수에서부터 구독 자신의 구성 요소에 입력으로().