在 mat-grid-tile 中提取对象

extract object in mat-grid-tile

我正在尝试通过循环 [object] 创建 mat-grid-list。例如对象:

[{ "db": {
        "user": "<User>",
        "password": "<Password>",
        "server": "<Server>",
        "database": "<Database>",
        "trustServerCertificate": true,
        "options": {
          "instanceName": "<Instance Name>",
          "port": 111
        }
      }}]

我在 mat-grid-tile 中提取“选项”的问题。 我尝试使用 ng-template 但它不起作用我得到一个空值

     <mat-card *ngFor="let settings of conf.environment.db | keyvalue">       
       <mat-grid-list cols="2" rowHeight="20px">
        <ng-template [ngIf]="settings.key !== 'options'; else _options">
          <mat-grid-tile id="title">{{settings.key}}</mat-grid-tile>
          <mat-grid-tile id="description">{{settings.value}}</mat-grid-tile>
        </ng-template>
       </mat-grid-list>
     </mat-card>

     <ng-template #_options  ngFor let-opt [ngForOf]="conf.environment.db.options | keyvalue">   
           <mat-grid-tile id="title">{{opt.key}}</mat-grid-tile>
           <mat-grid-tile id="description">{{opt.value}}</mat-grid-tile>
     </ng-template>

感谢您的帮助。

尝试修改如下:

<mat-card *ngFor="let settings of data.db | keyvalue">
  <mat-grid-list *ngIf="settings.key != 'options'; else _opt" cols="2" rowHeight="20px">
    <mat-grid-tile  id="title">{{ settings.key }}</mat-grid-tile>
    <mat-grid-tile id="description">{{ settings.value }}</mat-grid-tile>
  </mat-grid-list>
</mat-card>

<ng-template #_opt>   
 <div *ngFor="let opt of data.db.options | keyvalue">
  <mat-grid-list  cols="2" rowHeight="20px">
    <mat-grid-tile  id="title">{{ opt.key }}</mat-grid-tile>
    <mat-grid-tile id="description">{{ opt.value }}</mat-grid-tile>
  </mat-grid-list>
 </div>
</ng-template>