我正在嘗試實作這個對話框，我只需要根據條件的結果顯示一條訊息。
對話框的 html：
<div mat-dialog-content>
Message:{{message}}
</div>
打開對話框的代碼：
constructor(public dialog: MatDialog,)
updateDescription() {
doSomething().subscribe(() => {
this.openDialog(`Success`)
}, error => {
this.openDialog(`OOOPS ${error}`)
}
)
}
openDialog(message: String) {
this.dialog.open(DialogUpdateMessage, {
data:{
message: message
}
})
}
觸發事件的 HTML 會打開對話框：
<textarea matInput style="resize: none;" rows="7">{{description}}</textarea>
</mat-form-field>
<mat-button-toggle (click)="updateDescription()">Update description</mat-button-toggle>
</form>
對話框組件的 ts 類：
@Component({
selector: 'dialog-update-message',
templateUrl: 'dialog-update-message.html',
})
export class DialogUpdateMessage {
constructor(@Inject(MAT_DIALOG_DATA) public message: String)
{ }
我執行單擊時看到的是一個對話框[object: Object]，其中沒有任何訊息。我認為我對函式
的內容做錯了，不知何故物件沒有正確呈現。openDialogdata
uj5u.com熱心網友回復：
我建議更改將資料發送到對話框的方式，而不是將資料作為object發送方式發送string （這看起來是您的用例）。
openDialog(message: String) {
this.dialog.open(DialogUpdateMessage, {
data:{
message: message
}
})
}
相反，請在此處發送一個字串。如果您打算只發送一個屬性，如果您打算發送多個屬性，那么您必須創建物件。但是在您的用例中
openDialog(message: String) {
this.dialog.open(DialogUpdateMessage, {
data: message
})
}
現在您的代碼應該可以正常作業了。
<div mat-dialog-content>
Message:{{ message }}
</div>
并且該屬性message將被鍵入為stringso，該方法將確保您發送一個string.
uj5u.com熱心網友回復：
您正在將物件作為資料發送，并且您正嘗試將其作為字串讀取嘗試類似的操作
export class DialogUpdateMessage {
constructor(@Inject(MAT_DIALOG_DATA) public data: any)
<div mat-dialog-content>
Message:{{data.message}}
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/421066.html
標籤：