首页 > 解决方案 > 声明和初始化一个类并在其他类中使用它

问题描述

我正在尝试了解一些角度基础知识。我创建了一个这样的类。我不确定这是正确的方法。

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 文件中创建了它

那么我如何在不同的组件下拉列表中使用这些。请忽略我糟糕的语言。

标签: angulartypescript

解决方案


我认为您应该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() {}


    }

您可以在所需的任何组件中访问该模型。


推荐阅读