angular – MatDialog无法正确显示
发布时间:2020-12-17 06:55:01 所属栏目:安全 来源:网络整理
导读:我正在尝试使用MatDialog并基于 this example我已经实现了如下对话框: import {Component,Inject,OnInit} from '@angular/core';import {Router} from '@angular/router';import {AuthenticationService} from '../../../service/authentication.service';i
我正在尝试使用MatDialog并基于
this example我已经实现了如下对话框:
import {Component,Inject,OnInit} from '@angular/core'; import {Router} from '@angular/router'; import {AuthenticationService} from '../../../service/authentication.service'; import {MAT_DIALOG_DATA,MatDialog,MatDialogRef} from '@angular/material'; @Component({ selector: 'app-home',templateUrl: './home.component.html',styleUrls: ['./home.component.css'] }) export class HomeComponent { constructor(private router: Router,public dialog: MatDialog) { } openDialog(): void { const dialogRef = this.dialog.open(CreateGroupDialogComponent); } } @Component({ selector: 'app-create-group-dialog',template: ` <span>Hello World!</span> ` }) export class CreateGroupDialogComponent { constructor(public dialogRef: MatDialogRef<CreateGroupDialogComponent>) { } } 但是,即使按下相应按钮时对话框出现,我得到的是: 不显示HTML模板,并且模式的尺寸错误. 我不知道问题是什么.为什么模态没有正确绘制? 这是打开模态时生成的HTML代码.可以看出它是空的. 解决方法
您需要将它添加到@NgModule上的entryComponents中
import { BrowserModule } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { NgModule } from '@angular/core'; import { MatDialogModule,MatButtonModule } from '@angular/material'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { LoginComponent } from './login/login.component'; import { HomeComponent,DialogOverviewExampleDialogComponent } from './home/home.component'; @NgModule({ declarations: [ AppComponent,LoginComponent,HomeComponent,DialogOverviewExampleDialogComponent ],imports: [ BrowserModule,BrowserAnimationsModule,AppRoutingModule,MatDialogModule,MatButtonModule ],providers: [],bootstrap: [AppComponent],entryComponents: [ DialogOverviewExampleDialogComponent ] }) export class AppModule { } 重复Angular2 material dialog has issues – Did you add it to @NgModule.entryComponents? (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |