Eu criei um modelo de example.component.html
que recebe um método como uma variável para a sua ação de clique:
<div>
<button (click)="method()">click here</button>
</div>
no example.component.ts
arquivo, o método vem de uma entrada(), para que eu possa utilizar este modelo em várias situações:
@Component({
selector: 'example',
templateUrl: './example.component.html',
})
export class ExampleComponent implements OnInit {
@Input() method;
constructor() {}
ngOnInit(): void {}
}
Aqui é onde fica complicado. O principal componente, o método que será acionado ao clicar usa uma variável proveniente de um observável:
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 {}
}
Mesmo que o principal componente é a subscrição businessEntityService
observáveis e eu check ele tem em dados de fato, quando eu clicar no botão, o console de logs undefined
.
Eu entendo isso provavelmente tem a ver com o âmbito e a pilha está procurando this.business
as crianças componente, no entanto, eu gostaria de saber se há uma maneira de chamar um método que utiliza uma variável a partir de uma subscrição a partir de seu próprio componente de Input().