* ngFor循环中的子组件选择器

Question

我已成功实现了角度的父子输入输出通信。 我正在通过孩子的现有产品

parent.html

 <tr *ngFor="let product of productList"> 
    <app-stock-popup *ngIf="product.isCheckInPopUp" (exitModalComp)="saveModalProductEntries($event)"
    [productChild]="product">
    </app-stock-popup>
    <button (click)="openChildComp()">Open Child </button>
    </tr>

parent.component.ts

 openChildComp(product)
    {
    product.isCheckInPopUp = true;
    }

Child.component.ts

  @Input() productChild: ProductRow<ProductCategory, ProductItemDetails>;
  @Output() exitModalComp: EventEmitter<any> = new EventEmitter<any>();

//For emitting  Child comp
this.exitModalComp.emit(this.productChild);

现在我的问题是我应该将子组件选择器放在循环内部还是外部。

 <tr *ngFor="let product of productList"> 

        </app-stock-popup>
        <button (click)="openChildComp()">Open Child </button>
        </tr>
   <app-stock-popup *ngIf="otherBoolean" (exitModalComp)="saveModalProductEntries($event)"
        [productChild]=" some input List">

哪种方法更好，为什么？  1.如果我将选择器放在* ngFor中，是否需要更多内存。  2. HTML渲染与* ngFor

中的项目一样多次

我的朋友建议我把选择器放在* ngFor之外，因为孩子花了更多的记忆或更多的HTML渲染。他是对的

我的意见是* ngIf从DOM中删除元素（子），所以两者都是一样的。

需要解释。