Question

打字稿：

heroes = [
    new Hero('Windstorm', 1),
    new Hero('Bombasto', 13),
    new Hero('Magneta', 15),
    new Hero('Tornado', 22)
  ];

add(val: string) {
  if (val && !this.heroes.includes(new Hero(val))) {
    alert(this.heroes.includes(new Hero(val)));
    this.heroes.push(new Hero(val));
  }
}

export class Hero {
  constructor(
    public name: string,
    public id?: number
  ) { }
}

HTML：

<input #box (keyup)="0" (keyup.enter)="onKey(box.value)">
<button (click) = "add(box.value)">Add</button>

我想创建一个添加按钮，检查该值是否存在于我的数组中（类Hero中的名称），如果存在，请不要添加它。仅在键name的数组中不存在键入的字符串时才添加。

Answer 1

您不能像这样使用includes()，因为它会在数组中寻找那个确切的对象，因为您刚刚创建了它，所以它永远找不到。您需要按值检查。一种方法是查看some()个英雄是否有特定名称：

add(val: string) {
  // it is not the case that some heroes are named val
  if (val && !this.heroes.some(hero => hero.name === val )) {
    this.heroes.push(new Hero(val));
  }
}

这假设每个英雄都应该有一个唯一的名字。如果要允许英雄在数组中使用重复的名称，则需要一些其他属性来定义唯一性，例如唯一ID。

Answer 2

您可以使用findIndex（）来检查元素是否存在于数组中

    add(value:string) {

       if (this.heros.findIndex(x => x.name === value) === -1) {
        this.heroes.push(new Hero(value));
     } 
  }

Angular2 +，检查数组中是否存在具有类定义的值

2 个答案: