Angular - Невозможно найти отличающийся вспомогательный объект 'Item One' типа 'string'. NgFor поддерживает только привязку к итерациям, таким как массивы

Question

Несколько вопросов по StackOverflow аналогичны этому, но не удалось найти подходящее решение.

Мой код работает нормально при попытке извлечь элементы в элемент управления «Выбор», я получаю успешный результат, если количество элементов больше 1, но странная вещь, если возвращаемые данные содержат только один элемент, я получаю консольную ошибку, указывающую на код шаблона и говорящую:

Не удается найти другой объект поддержки 'Элемент Один' типа «строка». NgFor поддерживает только привязку к итерациям, таким как массивы.

Вот мой код Html:

      <mat-select [formControl]="itemControl" required [(value)]="itemValue">
        <mat-option>--</mat-option>
        <mat-option *ngFor="let item of items" [value]="item">{{item}}</mat-option>
      </mat-select>

Компонент:

export class LoginWithDbComponent implements OnInit, OnDestroy {
  . . .
  items: string[] = [];
  itemValue: string;

  constructor(
    . . .
    public authService: AuthService,
  ) {

  }

  login(): void {
    this.authService.login(this.getUserLogin()).subscribe(
      next => {
        this.getUserItems();
      },
      error => {
      . . .
    );    
  }

  getUserItems() {
    this.items= this.authService.userItems;
    return this.items|| []; 
  }

И service:

    export class AuthService {
      userItems: any = [];
      . . .
      login(model: any) {
        return this.http.post(this.baseUrl + 'login', model).pipe(
          map((response: any) => {
            const user = response;
            if (user) {
              this.decodedToken = this.jwtHelper.decodeToken(user.token);
              this.userItems = this.decodedToken['items'];
              console.log(this.userItems);              <--- shows 'Item One'
            }
          })
        );
      }
      . . .
    }

Так что же должно работать для этого конкретного случая?

Answer 1

Похоже, что токен "items" в ответе на ваш вызов "post" не является массивом, когда есть только один элемент. Возможно, вам придется проверить, является ли this.decodedToken['items'] массивом, и если нет, добавить одну строку в массив.

let itemsToken = this.decodedToken['items'];
this.userItems = Array.isArray(itemsToken) ? itemsToken : [itemsToken];