Question

我是新手。我正在开发一个网页。这样，当我单击对话框按钮时，它应该在words.all? { |word| "xapqbrc".include?(word) }中提示标题消息。但是，当我单击按钮时，它会提示对话框，但没有显示# ["a b c"] matches = ["a b c", "d e f"].select { |string| words = string.split(/ /) # The last statement in the block determines the truthiness of the block. words.all? { |word| "xapqbrc".include?(word) } }

中的文本

这是dialogComponent文件

dialog.component.html

这是app.component.ts文件

import { Component } from '@angular/core';
import { MatDialog}  from "@angular/material/dialog";
import { DialogComponent } from "./dialog/dialog.component";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
constructor(public dialog:MatDialog){}
onCreate():void{
  const dialogRef = this.dialog.open(DialogComponent, {
    width:'290px',
    height:'300px',
    
  });

  dialogRef.afterClosed().subscribe(result => {
    console.log('The dialog was closed');
  });
   
  }
}

这里是app.component.html

 <button mat-raised-button (click)="onCreate()">Open Dialog</button>

这里是dialog.component.html

<h1>Hello</h1>

对话框显示为enter image description here

Answer 1

您需要使用材料指令（mat-dialog-title mat-dialog-content和mat-dialog-actions等）来包装文档内容，以获取更多信息。

https://stackblitz.com/angular/epgpjvbnjbl?file=src%2Fapp%2Fdialog-overview-example-dialog.html

<h1 mat-dialog-title>Hi {{data.name}}</h1>
<div mat-dialog-content>
  <p>What's your favorite animal?</p>
  <mat-form-field>
    <mat-label>Favorite Animal</mat-label>
    <input matInput [(ngModel)]="data.animal">
  </mat-form-field>
</div>
<div mat-dialog-actions>
  <button mat-button (click)="onNoClick()">No Thanks</button>
  <button mat-button [mat-dialog-close]="data.animal" cdkFocusInitial>Ok</button>
</div>

显示对话框消息

1 个答案: