angular - Angular CLI 不从数组返回任何值

Question

所以我有一个组件，我在其中定义了字符串数组

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

@Component({
  selector: 'app-products-list',
  templateUrl: './products-list.component.html',
  styleUrls: ['./products-list.component.css']
})
export class ProductsListComponent {
  products = ['test1', 'test2', 'test3'];

  constructor() {
  }

}

然后我在 html 文件（products-list.component.html）中使用它，如下所示：

<p>products-list works!</p>
<ul>
  <li *ngFor='let product in products'>
    {{product}}
  </li>
</ul>

我的问题是，为什么 Angular 不将数组中的任何字符串显示为列表项？它只是打印出段落标签“产品列表有效！” .我为愚蠢的问题道歉，但我只是在学习 Angular。

标签： angulartypescript

Answer 1

试试这个，使用“of”而不是“in”。

<ul>
  <li *ngFor="let product of products">
    {{product}}
  </li>
</ul>