如何将嵌套的 json 数据填充到 angular 材料下拉列表

Question

This is Json Data........ I have to print difficultyLevel

I tried multiple times but thats not working. what changes are required in html file

const ELEMENT_DATA: data = {
      questions: [
        {
          difficultyLevel: 'esay',
          isOptionAvailable: true,
          isImageAvailable: false,
          imageUrl: '',
          questionType: 'e',
          maximumMarks: 20,
          timeToSolve: 12,
          questionId: 2,
          topicName: 'xs',
          classInfo: {
            classId: 10,
            className: '6',
          },
          subjectInfo: {
            subjectName: 'English',
            subjectId: 3,
          },

Interface

  interface data {
  questions: Question[];
  message: string;
  status: string;
}

interface Question {
  difficultyLevel: string;
  isOptionAvailable: boolean;
  isImageAvailable: boolean;
  imageUrl?: string;
  questionType: string;
  maximumMarks?: number;
  timeToSolve: number;
  questionId: number;
  topicName: string;
  classInfo: ClassInfo;
  subjectInfo: SubjectInfo;
  boardInfo: BoardInfo;
  images: any[];
  options: Option[];
}

What I'm trying:

    <mat-form-field class="drop-down" appearance="fill">
              <mat-label>--Difficulty Level--</mat-label>
              <mat-select [(ngModel)]="selectedValue" name="food">
                <mat-option *ngFor="let diff of  " [value]="diff.questionId">
                  {{ diff.difficultyLevel }}
                </mat-option>
              </mat-select>
            </mat-form-field>

But this is not working... How to write in mat-option

Answer 1

Use the below code to iterate.

<mat-form-field class="drop-down" appearance="fill">
              <mat-label>--Difficulty Level--</mat-label>
              <mat-select [(ngModel)]="selectedValue" name="food">
                <mat-option *ngFor="let diff of  ELEMENT_DATA.questions" [value]="diff.questionId">
                  {{ diff.difficultyLevel }}
                </mat-option>
              </mat-select>
            </mat-form-field>