基于列名称的下拉列表中的表数据

时间:2018-07-30 17:36:18

标签: angular5

我有一个像这样的模拟数据:

{
  "Uri": {
    "Fn::Join": [
      "",
      [
        "arn:aws:apigateway:",
        {
          "Ref": "AWS::Region"
        },
        ":lambda:path/2015-03-31/functions/",
        {
          "Fn::GetAtt": [
            "SyncLogsLambda",
            "Arn"
          ]
        },
        "/invocations"
      ]
    ]
  }
}

我已经获取了这些数据并将其显示在桌子上。现在,我想在基于列名称的下拉列表中显示所有这些数据。

我正在使用下面的代码,但显示不正确;

export const CHARACTERS: any[] =
[
  {
    name: 'Earl of Lemongrab',
    age: 'Unknown',
    species: 'Lemon Candy',
    occupation: 'Earl, Heir to the Candy Kingdom Throne'
  },
  {
    name: 'Bonnibel Bubblegum',
    age: '19',
    species: 'Gum Person',
    occupation: 'Returned Ruler of the Candy Kingdom'
  },
  {
    name: 'Phoebe',
    age: '16',
    species: 'Flame Person',
    occupation: 'Ruler of the Fire Kingdom'
  }

我也尝试过下面的代码,但是它给我一个错误,指出名称不是该列的已知属性。尽管我的专栏有四个字符串,例如[“ name”,“ age”,“ species”,“ gender”]

  <div class = "two">
   <select [(ngModel)]="searchText" name="char[column]" placeholder="select">
     <option 
       *ngFor="let char of characters"
          *ngFor="let column of columns"
       [ngValue]="char[column]">{{char[column]}}</option>  
   </select>
  </div>

1 个答案:

答案 0 :(得分:0)

  <div class = "two">
   <select [(ngModel)]="searchText" name="char[column]" placeholder="select">
     <option 
          *ngFor="column of columns"
       Value="char[column.name]">{{char[column.name]}}</option>  
   </select>
  </div>