Компонент Angular 2 - как экспортировать интерфейс?
Я разработал компонент заголовка, который требует данных типа "IHeader".
header.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HeaderComponent } from './header.component';
@NgModule({
imports: [
CommonModule
],
declarations: [
HeaderComponent
],
providers: [ ],
exports: [
HeaderComponent
]
})
export class HeaderModule { }
IHeader.ts
export interface IHeader {
headerName: string;
headerTitle: string;
headerVisible: boolean;
headerAttributes:IheaderAttributes;
headerType:string;
}
header.component.ts
export class HeaderComponent implements OnInit {
@Input() data: IHeader;
}
Как я могу экспортировать интерфейс «IHeader»?
Дополнительная информация
Я создал его как модуль, который другие продукты компании могут установить как модуль узла, используя команду «npm install ...». Разработчики могут импортировать компонент в свои продукты, но как ограничить пользователя передачей данных в определенном формате?
Вы пытались импортировать его так же, как и другие вещи?
Извините за путаницу. Я добавил к этому больше информации.
Ответы 2
Отметьте этот статья, если вы хотите создать угловую библиотеку / пакет.
Вы должны иметь возможность экспортировать свой интерфейс в файл interface_api.ts.
Обратите внимание, что с помощью этого трюка вам нужно импортировать определение интерфейса в ваши модули / компоненты / службы.
Но преимущество в том, что ваши функциональные модули будут зависеть от библиотеки, и поэтому функциональные модули можно будет повторно использовать в других проектах.
Таким образом, вы можете импортировать определение интерфейса из библиотеки (пакета angular) без необходимости полагаться на структуру папок в вашем проекте.
Надеюсь, это поможет тебе.
Спасибо. Я создал пакет angular, и он работает нормально. Единственное, с чем я борюсь, это как экспортировать интерфейс. Позвольте мне попробовать ваше предложение.
Привет, если вы создали библиотеку angular, у вас должен быть файл записи с именем api_public.ts. В этом файле вы можете экспортировать свои классы или интерфейсы, например: export * из «path / to / your / interface.ts». Затем в приложении angular вы можете импортировать классы / интерфейсы из библиотеки, например: import {your interface} из my-angular-lib. Обратите внимание, что я не пробовал, но, судя по тому, что я читал, он должен работать. Дай мне знать !
Here is the way to export the interface
Пример:
// car interface
// '?' shows that this property is optional
export interface car {
isCar?: boolean;
wheels?: number;
engine?: string;
engineType?: string;
}
Вам нужно добавить ключевое слово экспорт, чтобы экспортировать этот интерфейс в другие компоненты.
Допустим, вам нужно импортировать этот интерфейс в другой компонент ... Затем вы можете обратиться к этому коду:
import { Component, OnInit } from '@angular/core';
// import interface named car
import { car } from '@app/car.component';
@Component({
selector: 'app-car-collection',
templateUrl: './carCollection.component.html'
})
export class HyundaiCarComponent implements OnInit {
// Here.. You can give HyundaiCar variable of type car
HyundaiCar: car = {
isCar= true,
wheels= 4,
engine= '4-stroke',
engineType= 'petrol'
};
constructor() {}
ngOnInit(): void {}
}
в component.ts импортировать {IHeader} из 'location / IHeader'