Как проверить, есть ли значение в массиве данных? ngIf

#javascript #html #angular

#javascript #HTML #угловой

Вопрос:

Мне нужно проверить, существует ли значение в массиве данных.

gjhg = [ id, name ]

Комментарии:

1. !!training.id ? Или вам нужно проверить, есть ли фактическое существующее значение? Трудно сказать с предоставленной информацией.

2. Мне нужно проверить, есть ли фактическое существующее значение

3. Только для проверки, если training.id идентификатор, существующий в любом массиве идентификаторов

4. Я бы добавил метод в класс component, который выполняет проверку за вас, используя array . найти, например

5. можете ли вы предоставить мне пример кода?

Ответ №1:

Как указано в комментарии, это лучше всего подходит для метода в контроллере компонента, т.Е.

 import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  allowedIds = [1, 2, 12] // What I want to be allowed to show
  data = [
    {id: 1, value: 'whatever'},
    {id: 2, value: 'whatever2'},
    {id: 6, value: 'whatever3'},
    {id: 9, value: 'whatever4'},
    {id: 12, value: 'whatever5'},
  ] // Actual data

  idExists(id) {
    // Only return true if the supplied ID is in the allowedIds array
    return this.allowedIds.includes(id)
  }
}
  
 <div *ngFor="let d of data">
    <pre *ngIf="idExists(d.id)">{{ d | json }}</pre>
</div>
  

Stackblitz

Ответ №2:

Другой подход, при котором нам не нужно объявлять выделенную функцию в файле ts

Это работает, когда нам нужно проверить, имеет ли запись идентификатор или нет

 <div *ngFor="let d of data">
    <pre *ngIf="d.id">{{ d | json }}</pre>
</div>
  

Это работает, когда у нас есть список разрешенных идентификаторов и могут отображаться только записи с разрешенными идентификаторами

 <div *ngFor="let d of data">
    <pre *ngIf=" allowedIds.includes(d.id )">{{ d | json }}</pre>
</div>
  

StackBlitz

Комментарии:

1. Более полезно ссылаться на stackblitz, который показывает код, и включать код сюда.

2. @Phix, пожалуйста, найдите пример stackblitz здесь — stackblitz.com/edit/angular-ivy-9bupqm?file=src/app /…

3. Вопрос заключался в том, чтобы отображать что-то, только если идентификатор существует в массиве, не уверен, что вы здесь имеете в виду.

4. @Phix пожалуйста, дайте мне знать, если ответ выглядит хорошо после этого редактирования.