Question

我正在使用* ngIf加载新组件（当用户打开弹出窗口时），并且我不想在用户关闭弹出窗口后销毁它，因为ngIf这样做。

我的组件必须请求http来获取数据，当用户打开然后再次关闭弹出窗口时，我不希望有很多请求。

有什么方法可以代替将http请求部分移至父组件？还是应该使用动态组件？

谢谢。

很难在这里插入代码，所以我使用伪代码：

Parent component 
class {
  showIt = false;
  toggleClick() {
    showIt = !showIt;
  }
}

In parent component tempate:
<child-component ngIf='showIt'></child-component>

Child component:
class {
  construct() {
    console.log('Loaded childcomponent') // It prints out every time showIt value is changed
  }
  ngOnInit() {
    Call service to get data  // and I don't want it call multiple times when ngIf recreate child component
  }
}

Answer 1

您可能最初可以使用*ngIf，直到用户决定打开它为止。用户打开它后，*ngIf的评估结果应为true。

但是，在关闭按钮上，不要将*ngIf评估为false，而是使用[hidden]并将其设置为true。这样，该组件只会被隐藏而不被破坏。

希望有帮助。

Answer 2

不使用ng如果仅使用css display：none在关闭组件时隐藏组件

用户打开弹出窗口后加载组件，但关闭弹出窗口后不销毁它

2 个答案: