Question

在我的应用程序组件中，我有一个手风琴，用户选择菜单的ID将通过使用ngOnChanges传递给子组件，从子组件调用基于app组件所选菜单ID的API。

手风琴结构类别，组，子组

这里我要做的是，当用户选择了一个类别，组和子组时，Id被传递给子组件，API也会被调用。

让我们分别假设第一个选定的ID（100,101,102）

现在用户选择同一类别下的另一个组，现在通过传递错误的ID（100,200,102）来调用API，这里用户没有选择任何子组，但是该值取自前一个值。

那我怎么做以下

1，当用户选择新组时清除子组值。
2，当用户选择新类别时清除组值。

Stackblitz文件：

https://stackblitz.com/edit/angular-bootstrap-carousel-dynamic2-exbr5f?file=app%2Fchild%2Fchild.component.ts

编辑：

ngOnChanges(changes: SimpleChanges) {

    if (changes['C_code'].currentValue != "") {
      this.a = changes['C_code'].currentValue ;
      if (this.a != changes['C_code'].previousValue) {
        this.G_code = "";
        this.SG_code = "";
      }
    }

    if (changes['G_code'].currentValue != "") {
      this.b = (changes['G_code'].currentValue);
      if (this.b != changes['G_code'].previousValue) {
        this.SG_code = "";
      }
    }

  }

Stackblitz文件：

https://stackblitz.com/edit/angular-bootstrap-carousel-dynamic2-9i1xzr?file=app/child/child.component.ts

Answer 1

您可以在AppComponent中执行此操作，方法是在事件挂钩中将相应的值设置回null / empty：

changeGroupCode(event: any) {
    this.groupCode = event;
    this.subGroupCode = null;
}

然后在您的子组件中，在调用API之前检查每个值上的空/空字符串。

如何根据Angular4中的选择清除ngOnchanges中的先前值

1 个答案: