Question

我想显示一个基于Angular组件中名为“ showID”的属性的切换按钮。该组件使用服务，并且每当初始化页面（ngOnInit）时，showID属性都将设置为服务中的任何值。

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

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

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，我希望切换开关也将关闭但仍会打开。

Answer 1

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

如何获取我的组件以读取Angular属性？

1 个答案: