通过自定义角材料模块导入组件

Question

遵守建议的最佳实践，我将所有打算使用的角材料模块导入自定义模块：

import { NgModule } from '@angular/core';
import {
    MatIconModule,
    MatChipsModule,
    MatCardModule,
    MatGridListModule,
    MatMenuModule,
    MatToolbarModule,
    MatSidenavModule,
    MatListModule,
    MatTableModule,
    MatTabsModule,
    MatInputModule,
    MatDialogModule,
    MatButtonModule
} from '@angular/material';
import { FlexLayoutModule } from '@angular/flex-layout';
const dependencyArray = [
    // Angular Material
    MatIconModule,
    MatCardModule,
    MatGridListModule,
    MatMenuModule,
    MatToolbarModule,
    MatSidenavModule,
    MatListModule,
    MatTableModule,
    MatTabsModule,
    MatInputModule,
    MatDialogModule,
    MatButtonModule,
    MatChipsModule,
    // flex
    FlexLayoutModule
];
/**
 * Imports needed Angular Material/flex dependencies.
 */
@NgModule({
    imports: dependencyArray,
    exports: dependencyArray
})
export class MaterialModule { }

当涉及导入组件（例如MatDialogRef）时，我不确定该怎么办：

export class MyComponent implements OnInit {
    selection: string;
    count: number;
    dialogRef: MatDialogRef<ServerDialogComponent>;
}

Internet上使用导入模块（包括角材料本身！）的所有示例直接从@angular/material导入组件，这似乎与导入模块的点相反。我的期望是这些也应该通过我的MaterialModule，但是我还没有找到有效的程序。一个建议是将declarations: [MatDialogRef]添加到MaterialModule的身体中。另一个是添加entryComponents: [MatDialogRef]。另一个仍然是像模块一样直接导入/导出组件。这些解决方案都没有用。打字稿每次都抱怨'找不到名称" matdialogref"'。

进口角材料成分的最佳实践是什么？可以像我已经像我一样通过模块完成吗？还是我应该直接从@angular/material进口？

Answer 1

这里的最大区别是共享角模块和打字稿导入的方式。

通过从您的角模块中导出一个组件，可以在将其导入的模块的HTML中使用。但是，如果要将组件导入打字稿，则需要将实际文件引用，因为打字稿需要它来编译组件的代码。

因此，您必须从 @angular/材料

Answer 2

在您的组件中，您需要从Angular材料中导入TypeScript的模块。在您的情况下，我将如下：

import {MatDialogRef} from '@angular/material';

请尝试并分享更新。