无法正确地在设置变量for循环离子

Question

我工作的爱奥尼亚电子商务应用，我检查出的库存使用0或1的产品。

这是我的productdetails.ts：

outofstockp: boolean = false;

for(var k in this.detailsp.msg)
{
  console.log(this.detailsp.msg[k].out_of_stock);
  if(this.detailsp.msg[k].out_of_stock === "1")
  {
    this.outofstockp = true;
    this.hassize = false;
  }
}

在此，this.detailsp.msg是包含产品阵列。所以，这就是为什么我已经应用了循环检查产品outofstock。 console.log(this.detailsp.msg[k].out_of_stock);是给我3个输出1,0和0，因为我有3个产品，但问题是，它是座位this.outofstockp = true;的所有产品。

这是我的productdetails.html：

<ion-col *ngIf="hassize" style="padding: 0px;">
      <button [disabled]="!product.SelectedSize" class="mybtn11" (click)="addToCart(product)" ion-button small>
        Add to Cart
      </button>
</ion-col>

<ion-col *ngIf="outofstockp" style="padding: 0px;">
    <button disabled class="mybtn11" ion-button small>
      Out Of Stock
    </button>
</ion-col>

在此，我用2个按钮，如果产品是outofstock它将outofstock按钮，否则它会显示addtocart按钮。但问题是，它显示outofstock按钮，所有的产品，因为我的条件，运行正常。

任何帮助深表感谢。

Answer 1

我不认为这是一个好主意，在您的TS文件这一逻辑。您可以轻松地在HTML文件处理这个问题。假设您已经通过产品阵列中的模板循环档案（.html），并在每次迭代中你就会得到一个产品对象。由于您的TS文件指出您的产品对象有一个名为OUT_OF_STOCK属性，你可以在HTML直接使用该属性。

像这样的事情，

<ion-col *ngIf="product.out_of_stock == '0'" style="padding: 0px;">
      <button [disabled]="!product.SelectedSize" class="mybtn11" (click)="addToCart(product)" ion-button small>
        Add to Cart
      </button>
</ion-col>

<ion-col *ngIf="product.out_of_stock == '1'" style="padding: 0px;">
    <button disabled class="mybtn11" ion-button small>
      Out Of Stock
    </button>
</ion-col>

如果你想在只有TS文件来处理这个问题，那么你就需要考虑使用键，值确定在您的重点将是您的产品标识或产品的对象，和值将是包含outofstockp每个产品的阵列，hassize值。但我建议你不要这样做，因为你必须达到你的结果在模板中最简单的方法。

Answer 2

this. outofstockp = true重新更新在每个循环中，你需要使用* ngFor在模板中使用数组而不是单个值，你的代码是越野车，请询问这样的问题前先查看自己的逻辑