将第三方库导入 Angular 库出错
Import third-party libraries to Angular Library gives error
正在尝试使用 ng-packagr 创建库。
内部项目 I 运行 :
ng g 库 nt-select --prefix nt
在 nt-select.component.ts
里面
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'nt-nt-select',
template: `
<mat-form-field>
<mat-select [placeholder]="placeholder" [disabled]="disabled" [multiple]="multiple" [(ngModel)]="value"
[required]="required">
<ngx-mat-select-search *ngIf="searchable"
[formControl]="optionFilterCtrl"
[placeholderLabel]="'Axtar'"
[noEntriesFoundLabel]="'Tapılmadı'"
[clearSearchInput]="false"
></ngx-mat-select-search>
<mat-option *ngFor="let opt of filteredOptions$ | async" [value]="opt.value">
{{opt.label}}
</mat-option>
</mat-select>
<mat-error>{{getErrors('hobbies')}}</mat-error>
</mat-form-field>
`,
styles: []
})
export class NtSelectComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
和nt.select.module:
import { NgModule } from '@angular/core';
import { NtSelectComponent } from './nt-select.component';
import {CommonModule} from '@angular/common';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {MatSelectModule} from '@angular/material';
import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
@NgModule({
imports: [
CommonModule,
BrowserAnimationsModule,
MatSelectModule,
NgxMatSelectSearchModule,
ReactiveFormsModule,
FormsModule
],
declarations: [NtSelectComponent],
exports: [NtSelectComponent]
})
export class NtSelectModule { }
问题是 nt-select 发出错误 cannot find name of mat-form-field, mat-select, ngx-mat-select- search 即使我导入了所有模块。
以下教程:https://blog.angularindepth.com/creating-a-library-in-angular-6-87799552e7e5
可能是什么问题?
提前致谢
在您的 ng-package.json
文件中包含 angular material 和其他外部包
{
"lib": {
"entryFile": "public_api.ts",
"externals": {
"@angular/material/input": "ng.material.input",
"@angular/material/select": "ng.material.select"
.....
}
}
}
正在尝试使用 ng-packagr 创建库。
内部项目 I 运行 :
ng g 库 nt-select --prefix nt
在 nt-select.component.ts
里面import { Component, OnInit } from '@angular/core';
@Component({
selector: 'nt-nt-select',
template: `
<mat-form-field>
<mat-select [placeholder]="placeholder" [disabled]="disabled" [multiple]="multiple" [(ngModel)]="value"
[required]="required">
<ngx-mat-select-search *ngIf="searchable"
[formControl]="optionFilterCtrl"
[placeholderLabel]="'Axtar'"
[noEntriesFoundLabel]="'Tapılmadı'"
[clearSearchInput]="false"
></ngx-mat-select-search>
<mat-option *ngFor="let opt of filteredOptions$ | async" [value]="opt.value">
{{opt.label}}
</mat-option>
</mat-select>
<mat-error>{{getErrors('hobbies')}}</mat-error>
</mat-form-field>
`,
styles: []
})
export class NtSelectComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
和nt.select.module:
import { NgModule } from '@angular/core';
import { NtSelectComponent } from './nt-select.component';
import {CommonModule} from '@angular/common';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {MatSelectModule} from '@angular/material';
import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
@NgModule({
imports: [
CommonModule,
BrowserAnimationsModule,
MatSelectModule,
NgxMatSelectSearchModule,
ReactiveFormsModule,
FormsModule
],
declarations: [NtSelectComponent],
exports: [NtSelectComponent]
})
export class NtSelectModule { }
问题是 nt-select 发出错误 cannot find name of mat-form-field, mat-select, ngx-mat-select- search 即使我导入了所有模块。
以下教程:https://blog.angularindepth.com/creating-a-library-in-angular-6-87799552e7e5
可能是什么问题?
提前致谢
在您的 ng-package.json
文件中包含 angular material 和其他外部包
{
"lib": {
"entryFile": "public_api.ts",
"externals": {
"@angular/material/input": "ng.material.input",
"@angular/material/select": "ng.material.select"
.....
}
}
}