Bri*_*ien 1 html javascript css angular-material angular
刚开始构建Angular应用。我正在写一个小的图书清单应用程序。我遇到的麻烦对话框组件从材料模块。我已经访问了Angular材料网站以检查我的实现,但仍然无法使其按预期运行。我有一个类似的问题与小吃吧成分。想知道以前是否有人遇到过此问题。谢谢你的帮助!
app.Module.ts
import {MatDialogModule } from '@angular/material/dialog';
imports:[MatDialogModule]
Run Code Online (Sandbox Code Playgroud)
collection.component.ts
import {MatDialogModule, MatDialogRef } from '@angular/material/dialog';
bookDetailDialogRef: MatDialogRef<BookDetailComponent>;
constructor(private dataService: DataService, private snackBar: MatSnackBarModule,
private _dialog: MatDialogModule, private _router: Router){}
openDialog(bookId: number): void{
let config = {with: '650px', height: '400px', position: {top: '50px'}};
let dialogRef = this._dialog.open(this.bookDetailDialogRef, config);
dialogRef.componentInstance.bookId = bookId;
dialogRef.afterClosed().subscribe(res => {this.getBooks();});
}
Run Code Online (Sandbox Code Playgroud)
collection.component.html
<button mat-button (click)="openDialog(book.id)"><i class="material-icons">
pageview</i> Dialog</button>
Run Code Online (Sandbox Code Playgroud)
_dialog的类型MatDialog不是MatDialogModule,并将MatSnackBarModule更改为MatSnackBar。在您的构造函数中将其更改为
constructor(private dataService: DataService, private snackBar: MatSnackBarModule,
private _dialog: MatDialog, private _router: Router){}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1992 次 |
| 最近记录: |