angular - 声明和初始化一个类并在其他类中使用它
问题描述
我正在尝试了解一些角度基础知识。我创建了一个这样的类。我不确定这是正确的方法。
export class Cars{
Items:Car[]=[];
/**
*
*/
constructor() {
this.Items = [
{ id: "1", name: "Honda" },
{ id: "2", name: "Hyundai" },
{ id: "3", name: "Nissan" },
{ id: "4", name: "Suzuki" },
{ id: "5", name: "Audi" },
{ id: "6", name: "BMW" },
{ id: "7", name: "Mercedes" },
{ id: "8", name: "Toyota" }
];
}
}
interface Car{
id:string;
name:string;
}
我创建了这个是因为我们有不同的组件,其中需要许多下拉菜单来提供这些汽车品牌。所以我在一个名为cars.model.ts的 Ts 文件中创建了它
那么我如何在不同的组件下拉列表中使用这些。请忽略我糟糕的语言。
解决方案
我认为您应该car.interface.ts
在您提供所需模型的文件夹(例如:)中创建一个单独的汽车界面。
export interface Car {
id: string,
name: string
}
在您的component.ts
文件中,您应该创建一个对象,该对象将作为您的Car
界面模型。
首先是导入部分:
import { Cars } from '....'
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit{
myItems: Car[]
constructor() {
this.myItems = [
{ id: "1", name: "Honda" },
{ id: "2", name: "Hyundai" },
{ id: "3", name: "Nissan" },
{ id: "4", name: "Suzuki" },
{ id: "5", name: "Audi" },
{ id: "6", name: "BMW" },
{ id: "7", name: "Mercedes" },
{ id: "8", name: "Toyota" }
];
}
ngOnInit() {}
}
您可以在所需的任何组件中访问该模型。
推荐阅读
- typescript - 如何在嵌套对象字段上使用三元运算符来验证我的打字稿类型
- mysql - MySQL大用户数据存储
- c++ - c ++将应用程序窗口保存到文件产生“不正确”区域?
- nextflow - RNA-seq 示例工作流程中的 nextflow .collect() 方法
- reactjs - NextJs 尝试使用 mp4 文件作为背景
- javascript - React.Children 将(函数)字符串作为“类型”返回自定义组件作为带有打字稿的子组件
- reactjs - Material-UI 文本字段和文本标签
- javascript - 在为 tagsInput JQuery 库添加至少一个标签后,如何删除 defaultText 属性?
- winforms - 获取 UI Path 中的 Listview 子项
- next.js - 仅针对某些路线运行“下一个导出”