Angular ngFor将字符串数组视为一个字符串



我有一个弹出对话框,它从后端接收字符串列表。我想使用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()函数或后端以错误的格式返回数据。

最新更新