使用 ngFor 循环 Angular 时无法绑定到 'index'

Question

当我尝试将 *ngFor 循环的 index 传递到组件时出现以下错误。

无法绑定到 'count'，因为它不是 'app-details'

的已知属性

它接缝我无法通过索引。

第一个文件

import { Component } from '@angular/core';
import { App } from 'reg.interface';

@Component({
  selector: 'reg',
  styleUrls:['reg.component.scss'],
  template:`
    <div class="container">
    <div class="col-6">
      <h2>App Details:</h2>
      <app-details *ngFor="let app of apps; let i = index;"
        [details]="app"
        [count]="i"
      </app-details>
    </div>
  </div>
  `
})

export class RegComponent {
 apps: App[];
}

第二个文件

import { Component, Input } from '@angular/core';
import { App } from 'reg.interface';

@Component({
  selector: 'app-details',
  template: `
  <div class="col-12">
      <span>Index: {{ details | json }}</span>
      <span>Index: {{ count }}</span>
  </div>
  `
})
export class AppDetailsComponent {
  @Input()
  app: App;
  count: number;
}

reg.interface

export interface App {
  type: string,
  price: number
}

我正在将 BrowserModule + CommonModule 导入我的 app.module

非常感谢任何帮助 - 如果需要，我可以随时向问题等添加更多详细信息。谢谢

Answer 1

export class AppDetailsComponent {
  @Input() app: App;
  @Input() count: number;
}

使用 ngFor 循环 Angular 时无法绑定到 'index'

Can't bind to 'index' when using ngFor loop Angular

javascript

ngfor

angular