共享服务无法从组件获取变量

Question

我正在尝试从自定义选择器上的外部组件调用函数。我找到了实现此目的的方法，但它无法识别组件中的任何变量。这就是我所做的：

选择器（声明为入口组件）：

HTML:

<button (click)="addCertificate(searchInput)">Add</button>

TS:

constructor(public sharedService: SharedFilterService ) {
}

public addCertificate(payload: any) {

    console.log("Step 1") // This is executed

    if (this.sharedService.add_LicenceComponent) {

        console.log("Step 2") // This one too
        this.sharedService.add_LicenceComponent(payload);
    }
}

服务（声明为提供者）：

TS:

@Injectable()
export class SharedFilterService {

    public add_LicenceComponent: any;

    constructor() { }
}

最后是我无法访问任何变量的组件（许可证）：

TS:

  constructor(public dialogService: DialogService, public sharedService: SharedFilterService) {
      this.sharedService.add_LicenceComponent = this.addLicence;
     }

  addLicence(licence: any): void {
    console.log("Step 3") // Printed too
    this.dialogService.openDialog(DialogComponent, licence).afterClosed().subscribe(); // Here I get this: ERROR TypeError: Cannot read property 'openDialog' of undefined
  }

该服务只是一个中介。我在许可证组件内部使用了一个选择器（调用 addCertificate 的按钮）

Answer 1

为 sharedService 的 add_LicenceComponent 分配函数而不是返回 void。

另一件事是您得到 TypeError 因为在 constructor[= 中尝试访问它时服务未初始化28=]。将其移动到 ngOnInit() 并检查是否将它们添加到 providers

您需要对组件代码进行如下修改，

constructor(public dialogService: DialogService, public sharedService: SharedFilterService) { } ngOnInit() { this.sharedService.add_LicenceComponent = this.addLicence; } addLicence(licence: any) { console.log("Step 3") // Printed too return (licence) => this.dialogService.openDialog(DialogComponent, licence).afterClosed().subscribe(); }

您可以在此查看示例实现 stackblitz

共享服务无法从组件获取变量

Shared service can't reach variables from component

data-binding

typescript

angular