Angular 6 * ngFor指令不起作用

Question

我将cli升级到v6后创建了一个新项目，并使用Angular Material util添加了仪表板布局。

我只是乱搞并意识到ngFor不适合我。

我确保正在导入CommonModule，我检查了其他指令是否像import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-test', templateUrl: './test.component.html', styleUrls: ['./test.component.css'] }) export class TestComponent implements OnInit { topics: ['C','C#'] constructor() { } ngOnInit() { } } 一样工作。我做错了什么或者在更新后出了什么问题？

测试组件：

<div>
  <p>Topics</p>
  <ul>
    <li *ngFor="let topic of topics">{{topic}}</li>
  </ul>
</div>

HTML：

:not()

我刚把我的app-test组件放在Dashboard quickstart构建的卡片中，这就是渲染的内容。

截图：

Ng - 版本：

Answer 1

您被声明为变量，但您没有初始化它。试试这个

export class TestComponent implements OnInit {

    topics: [] = ['C','C#']

      constructor() { }

      ngOnInit() {
      }

    }

说明：

topics: ['C','C#']在此代码中，typescript如何处理它。 ['C','C#']是topics变量的数据类型，而不是为该变量赋值。所以你应该像

那样提供数据

topics :[]= ['C','C#']

Answer 2

您要声明主题的类型，而不是初始化

试

  

测试组件

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

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  topics: string[]

  constructor() { 
      this.topics=['C','C#'];
  }

  ngOnInit() {}

}