在模板中使用ngFor和@Input装饰器显示相同组件的倍数

Question

我在外部组件模板中使用ngFor循环通过单向绑定和@Input装饰器显示内部组件的倍数。

注意：出于隐私原因，我正在使用命名替换项。

外部模板：

<h1>Things</h1>
<ul>
  <li *ngFor="let obj of objects">
    <app-inner-component [object]="obj"></app-inner-component>
  </li>
</ul>

外部TS代码

export class DashboardComponent implements OnInit {
  object = [
     new Object('firstObject'),
     new Object('secondObject')
  ];
...

对象模型

export class Object {
   private name: string;

   constructor(name: string) {
      this.name = name;
   }
}

内部组件模板

<h2>{{this.name}}</h2>

内部组件TS代码

export class InnerComponent implements OnInit {
  @Input() object: Object;

渲染的外部模板仅显示一个项目符号点（不显示名称）。当我注释掉HTML选择器app-inner-component时，会出现两个项目符号。

我希望外部模板为：

事物

-firstObject

-secondObject

Answer 1

我首先看到的是ConcurrentQueue<T>在模板this中的存在，它不应该在模板中存在。

您的模板应为<h2>{{this.name}}</h2>