有没有办法在ngFor中声明一个特定的类型

Question

我正在使用ngFor来迭代Angular 4.x中特定类型[Menu]的集合

然后循环菜单对象[menu.items]的集合属性

不幸的是，我的IDE [Eclipse + Angular IDE]中的属性是未知的，即使Menu类将items属性定义为MenuItem的数组。

有什么想法吗？

相关类声明 -

export class MenuBase {
  id: string;
  title: string;
  isPublic: boolean;
  roles: string[];
  items: MenuItem[];
  position: number;
// rest of class omitted
}

export class MenuItem extends MenuBase {
  menuItemType: MenuItemType;
  callback: () => void;
  location: string;

  constructor (options: any) {
    super(options);
    this.location = options.location;
    this.menuItemType = options.menuItemType || MenuItemType.location;
    this.callback = options.callback;
  }
}

export class Menu extends MenuBase {
  constructor (options: any) {
    super(options);
  }
}

Answer 1

我成功完成的工作是为模板*ngFor创建一个新组件，并将其键入。

容器模板：

<ng-container *ngFor="item of items" >
  <my-custom-component [item]="item"></my-custom-component>
</ng-container>

自定义组件模板：

<div *ngIf="item.menuItemType == 'dropdown'">
  <!-- -->
</div>

ts文件：

@Component({})
export class MyCustomComponent {
  @Input() item: MenuItem
}