问题描述
我正在使用 ngFor 在 Angular 4.x 中迭代特定类型 [Menu] 的集合
然后在菜单对象 [menu.items] 的集合属性上循环
不幸的是,即使 Menu 类将 items 属性定义为 MenuItem 数组,该属性在我的 IDE [Eclipse + Angular IDE] 中也是未知的.
有什么想法吗?
相关类声明 -
导出类 MenuBase {id:字符串;标题:字符串;isPublic:布尔值;角色:字符串[];项目:菜单项[];位置:编号;//其余类省略}导出类 MenuItem 扩展 MenuBase {菜单项类型:菜单项类型;回调:() =>空白;位置:字符串;构造函数(选项:任何){超级(选项);this.location = options.location;this.menuItemType = options.menuItemType ||MenuItemType.location;this.callback = options.callback;}}导出类 Menu 扩展 MenuBase {构造函数(选项:任何){超级(选项);}}
附加信息 -这是我正在做的项目:https://github.com/savantly-net/ngx-menu
该项目将在 Eclipse 中显示错误,即使它是有效的.
我从未创建过任何文档,但我在这里使用了它-
https://github.com/savantly-net/sprout-platform/tree/master/web/sprout-web-ui
我成功的是为模板创建了一个新组件,*ngFor
将呈现并输入该组件.
容器模板:
<ng-container *ngFor="item of items" ><my-custom-component [item]="item"></my-custom-component></ng-容器>
自定义组件模板:
<!-- -->
ts 文件:
@Component({})导出类 MyCustomComponent {@Input() 项目:菜单项}
I am using ngFor to iterate a collection of a specific type [Menu] in Angular 4.x
Then looping on a collection property of the menu object [menu.items]
Unfortunately the property is unknown in my IDE [Eclipse + Angular IDE] even though the Menu class defines the items property as an array of MenuItem.
Any thoughts?
Relevant class declarations -
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);
}
}
Additional info -This is the project I was working on:https://github.com/savantly-net/ngx-menu
The project will show an error in Eclipse, even though it's valid.
I never created any documentation, but I used it here -
https://github.com/savantly-net/sprout-platform/tree/master/web/sprout-web-ui
What I've had success with is creating a new component for the template that the *ngFor
will render and have that typed.
Container template:
<ng-container *ngFor="item of items" >
<my-custom-component [item]="item"></my-custom-component>
</ng-container>
Custom Component template:
<div *ngIf="item.menuItemType == 'dropdown'">
<!-- -->
</div>
ts file:
@Component({})
export class MyCustomComponent {
@Input() item: MenuItem
}
这篇关于有没有办法在 ngFor 中声明特定类型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!