MatDialog不显示 [英] MatDialog not showing
本文介绍了MatDialog不显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想向我的应用程序添加一个对话框,但是由于某种原因它没有显示.
I want to add a dialog to my application, but for some reason it is not showing.
对话框组件:
import { Component, OnInit } from '@angular/core';
import {MatDialogRef} from "@angular/material";
@Component({
selector: 'app-connect-to-player-dialog',
templateUrl: './connect-to-player-dialog.component.html',
styleUrls: ['./connect-to-player-dialog.component.css']
})
export class ConnectToPlayerDialogComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
使用的方法:
connectToPlayer() {
const dialogConfig = new MatDialogConfig();
dialogConfig.disableClose = true;
dialogConfig.autoFocus = true;
this.dialog.open(ConnectToPlayerDialogComponent, dialogConfig);
}
我还将对话框添加到 entryComponents
:
entryComponents: [ConnectToPlayerDialogComponent]
我不知道可能会丢失什么...谢谢您的帮助!
I have no idea what could be missing... Thank you for any help!
完整代码:
import {Component, OnInit} from '@angular/core';
import {PLAYERS} from '../mock-players';
import {Router} from "@angular/router";
import {AlertService, AuthenticationService} from "../_services";
import {HttpClient} from "@angular/common/http";
import {AuthGuard} from "../_guards";
import {MatDialog, MatDialogConfig, MatDialogRef} from '@angular/material';
import {ConnectToPlayerDialogComponent} from "../connect-to-player-dialog/connect-to-player-dialog.component";
@Component({
selector: 'app-profile',
templateUrl: './profile.component.html',
styleUrls: ['./profile.component.css']
})
export class ProfileComponent implements OnInit {
players = PLAYERS;
c: MatDialogRef<ConnectToPlayerDialogComponent>;
constructor(private autheGuard: AuthGuard,
private authenticationService: AuthenticationService,
private alertService: AlertService,
private http: HttpClient,
private router: Router,
private dialog: MatDialog) {
}
ngOnInit() {
this.loadPlayers();
this.connectToPlayer();
}
loadPlayers() {
this.authenticationService.loadPlayersForPlayer(this.autheGuard.getUser().identityStr)
.subscribe(
data => {
this.players = data;
this.players.unshift(this.autheGuard.getUser());
//if (data.identityStr) {
//localStorage.setItem('currentUser', JSON.stringify(data));
//PdHeaderComponent.updateUserStatus.next(true);
//this.router.navigate(['']);
// } else {
//}
// this.alertService.success('Successfully logged in');
},
error => {
let errormsg: string = 'Unexspected Error occured.';
if (error.code == 401) {
errormsg = 'Wrong Playername or Password.';
}
this.alertService.error(errormsg);
});
}
connectToPlayer() {
const dialogConfig = new MatDialogConfig();
dialogConfig.disableClose = true;
dialogConfig.autoFocus = true;
this.c = this.dialog.open(ConnectToPlayerDialogComponent, {
width: '400px'});
}
}
模板:
<p>
connect-to-player-dialog works!
</p>
例外:
ERROR Error: Found the synthetic listener @slideDialog.start. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application.
at checkNoSyntheticProp (platform-browser.js:2991)
at DefaultDomRenderer2.listen (platform-browser.js:2975)
at DebugRenderer2.listen (core.js:15124)
at listenToElementOutputs (core.js:10307)
at createViewNodes (core.js:13416)
at createRootView (core.js:13339)
at callWithDebugContext (core.js:14740)
at Object.debugCreateRootView [as createRootView] (core.js:14041)
at ComponentFactory_.create (core.js:10960)
at ComponentFactoryBoundToModule.create (core.js:3922)
推荐答案
就像聊天中提到的那样:缺少BrowserAnimationsModule的导入
As in the chat mentioned: The import of the BrowserAnimationsModule was missing
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@NgModule({
// ...
imports: [BrowserAnimationsModule],
// ...
})
这篇关于MatDialog不显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文