javascript - 如何使用 Angular2 从控制台输出获取名称到 HTML 页面

Question

我有一个选择选项，其中公司名称必须显示在下拉列表中。谁能帮我从控制台输出中获取 HTML 名称。

HTML:

<select class="form-control" id="exampleSelect1" name="selected" [(ngModel)]="selectedCampaign" >
          <option *ngFor="let item of CampaignData" [ngValue]="item">{{item.campaign_name}}</option>
        </select>

typescript :

this.usersTableService.getCompanyData(this.token).subscribe(companies => {
    this.data = companies;
    this.companiesPDF = companies;
    var CampaignData = this.companiesPDF;
    console.log(JSON.stringify(companies));
  });
  }

控制台输出:

[ {"CVR":3456789,"name":"Benz","address":"34 rue du bourbier","phoneNo":633406546,"email":"claire.malinet@iae-aix.com","active":true,"accessId":null,"agreementNo":null,"id":18,"postalCodeId":null,"preSurvey":false},

{"CVR":1234567,"name":"Stefania's local","address":"Norre Alle 8","phoneNo":485698659,"email":"stefania.b.wiredelta@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":20,"postalCodeId":null,"preSurvey":false},

{"CVR":2365986,"name":"Churchdesk","address":"Kobenvan 32","phoneNo":25362536,"email":"stefaniabarabas@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":23,"postalCodeId":null,"preSurvey":false},

{"CVR":78945665,"name":"Peergrade","address":"Titangae 11, 2200 Kobenhavn","phoneNo":8659865,"email":"david@peergrade.com","active":true,"accessId":null,"agreementNo":null,"id":25,"postalCodeId":null,"preSurvey":false},

{"CVR":85968596,"name":"Bosch","address":"Norre Alle 7, 2500 Kobenhavn","phoneNo":78451296,"email":"hermagold@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":27,"postalCodeId":null,"preSurvey":false},

{"CVR":784586,"name":"Lala","address":"Kobenhavn 25S","phoneNo":78458526,"email":"lala@lala.com","active":true,"accessId":null,"agreementNo":null,"id":30,"postalCodeId":null,"preSurvey":false},

{"CVR":12345678,"name":"testWD","address":"Titangade 11, 2200 København","phoneNo":34567890,"email":"claire.m.wiredelta@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":37,"postalCodeId":null,"preSurvey":true}, {"CVR":12312322,"name":"Wirelocal","address":null,"phoneNo":123123123,"email":"maks.k.wiredelta@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":38,"postalCodeId":null,"preSurvey":false}, {"CVR":111,"name":"AnuShree","address":null,"phoneNo":23456,"email":"anushree.s.wiredelta@gmail.com","active":true,"accessId":null,"agreementNo":null,"id":39,"postalCodeId":null,"preSurvey":false},

{"CVR":38185470,"name":"Orbiz","address":"Lyskær 7, 1. 2730 Herlev","phoneNo":20638651,"email":"tandrup@orbizinsight.dk","active":true,"accessId":null,"agreementNo":null,"id":40,"postalCodeId":null,"preSurvey":true}]

请帮忙。

Answer 1

首先，您的模板应该可以访问您的模型，因此根据您的代码，正如您使用了 this.data 一样，您可以使用 data 来渲染数据。

其次，你可以像这样渲染它:

<select class="form-control" id="exampleSelect1" name="selected" [(ngModel)]="selectedCampaign" >
          <option *ngFor="let item of data" [ngValue]="item">{{item.name}}</option>
        </select>