如何让我的组件读取 Angular 属性？答案

【问题标题】：How can I get my component to read in an Angular property?如何让我的组件读取 Angular 属性？
【发布时间】：2019-07-10 19:18:18
【问题描述】：

我想根据 Angular 组件中名为“showID”的属性显示一个切换按钮。该组件使用服务，并且无论何时初始化页面 (ngOnInit)，showID 属性都会设置为服务中的任何值。

我正在使用服务，因为我的应用在“输入表单页面”和“设置”页面之间传输数据。切换按钮用于确定哪些字段（如姓名、年龄、性别）将显示在输入表单中。

在我的服务中，我将 showID 设置为 false。当设置组件被加载时，它将其名为 showID 的 OWN 属性设置为服务返回的任何内容。然而，尽管控制台记录了正确的 showID 值，但切换按钮仍然是“真”，我不知道如何在不对其进行硬编码的情况下使其为假。

export class FormService {
  showID: boolean = false;
}

// In my Settings component:
export class SettingsPage implements OnInit {
  showID: boolean;

constructor(
    private formService: FormService
  ) { }

ngOnInit() {
    this.showID = this.formService.getShowID();
}

// In my Settings HTML:
<ion-toggle checked="showID" (ionChange)="changeShowID()"></ion-toggle>

我希望切换开关会关闭，但它会打开，即使服务的值为 false。

【问题讨论】：

试试[checked]="showID"
谢谢！！有效

标签： angular

【解决方案1】：

您在 OnInit 中调用了一次服务，这意味着仅在组件初始化期间。您的服务可能具有正确的值，但您的变量没有它，因为它只分配给它一次。每次以您现在的方式更改时，您都需要重新分配它。您可以用于组件之间的通信，例如 EventEmitters 或将 Observable 放入您的服务中，当您切换并订阅组件中的 Observable 时，它会发出下一个值。

【讨论】：