时间戳

首页 > 解决方案 > 如何放入角度模板以检查特定数组是否包含具有等于某个值的属性的对象？

angular - 如何放入角度模板以检查特定数组是否包含具有等于某个值的属性的对象？

问题描述

我在 Angular 中有以下内容：

<div *ngIf="myarrayContainsEating('Chocolate')">Chocolate Is Good</div>

在我的组件中，我有：

myarray = [{'name':'Charles', 'age':25, 'eating':'Vanilla'}, {'name':'Joseph', 'age':18, 'eating':'Banana'}]

myArrayContainsEating(food) {

  let chocolateExists = false;
  for(var i = 0; myarray.length; i++) {
    if(myarray[i].eating == 'Chocolate') {
       chocolateExists = true;
    }
  }
  return chocolateExists;
}

问题是，当我有一个按钮时，我点击它并让它让查尔斯正在吃“巧克力”，它没有显示我期望的“巧克力很好”文本。有没有办法使这项工作？

标签： angulartypescript

解决方案

您的最终方法应如下所示：

myArrayContainsEating(food) {
   let chocolateExists = false;
   for (let i = 0; i < this.myarray.length; i++) {
      if (this.myarray[i].eating == food) {
         chocolateExists = true;
      }
   }
   return chocolateExists;
}

以下是您的代码的问题：

  1. 您的 if 条件不正确。将其更改为：

    if (myarray[i].eating === food) { 
   ... 
}

    您需要访问每个对象的吃属性。尽管如此，仍然会返回 false，因为数组中没有对象的吃键包含值巧克力。因此， 不会显示。myArrayContainsEating(...)myArray<div>

  2. 此外，您在循环中缺少一个终止条件：

    for(let i = 0; i < myarray.length; i++) {
   ...
}

  3. 接下来，您需要使用方法中传递的参数，即food在if表达式中求值。

或者，您可以轻松地执行以下操作：

myArrayContainsEating(food) {
   return this.myarray.find(e => e.eating === food);
}

推荐阅读