我有一个弹出对话框,它从后端接收字符串列表。我想使用ngFor将每个字符串打印为列表项。但是当对话框弹出时,整个数组显示为一个串联字符串。
需要对话组件.ts
import { Component, Inject, OnInit } from '@angular/core';
import {MAT_DIALOG_DATA} from '@angular/material/dialog';
import { MatDialogRef} from "@angular/material/dialog";
@Component({
selector: 'app-needs-dialog',
templateUrl: './needs-dialog.component.html',
styleUrls: ['./needs-dialog.component.css']
})
export class NeedsDialogComponent implements OnInit {
needs!: String[];
constructor( private dialogRef: MatDialogRef<NeedsDialogComponent>, @Inject(MAT_DIALOG_DATA) data)
{
console.log("logging data:")
console.log(data);
this.needs=data
console.log("logging needs array in NeedsDialogComponent:");
console.log(this.needs);
}
ngOnInit(): void {
}
close() {
this.dialogRef.close();
}
}
需要dialog.component.html
<h2 mat-dialog-title>Szükségletek</h2>
<mat-dialog-content >
<ul *ngFor="let value of needs; index as i" >
<li>{{needs}}</li>
</ul>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions>
**使用方法打开matdialog:**
openDialog(dogid:any): void {
this.matdialog.open(NeedsDialogComponent, {data:this.getDogNeeds(Number(dogid)),width: '500px',
height: '500px'});
}
对话框日志的控制台输出
对话框窗口
通过日志记录,数据是一个2D数组,您希望将列表作为第一个元素。
this.needs = data[0];
应该可以工作,但似乎是getDogNeeds()
函数或后端以错误的格式返回数据。