Angular 2在寫表格行而不是追加！目前使用* ngFor

其實我試圖將每個服務對象表示爲一個表格行，但是當我再次調用我的javascript函數時* ngFor創建將另一組行添加到現有行。Angular 2在寫表格行而不是追加！目前使用* ngFor

<tr class="table table-hover table-responsive " *ngFor="let service of services"> 
      <td>{{ service.serviceName }}</td> 
      <td>{{ service.state }}</td> 

      <td>{{ service.domainName }}</td> 
      <td>{{ service.releaseVersion }}</td> 
      <td>{{ service.editionDisplayName }}</td> 
      <td>{{ service.creationDate }}</td>

//表格行被附加而不是覆蓋！

jQuery對象解析！

onCreateServer(){ 
this.serverCreationStatus = 'Server Instance Created! ' + this.serverName; 
    return this.http.get('http://127.0.0.1:5000/PodChecker/', {params: 
    {Podurl: this.serverName 
    }}).subscribe((response: Response) => { 
     console.log(response); 
     const data = response.json(); 
     console.log(data); 
     this.Service_Instances = data; 
     this.dict = data; 
     console.log('Data[services]' + JSON.stringify(data['services'])); 
     console.log(this.dict); 
     this.Service_Instances = this.dict['services']; 
     //this.setValues(this.dict['services']); 
     console.log('Must Check' + JSON.stringify(this.setValues(this.dict['services']))); 
     console.log('This Services Output:' + JSON.stringify(this.services)); 

     }, 
     (error) => console.log(error) 
    ); 
    }

設定值功能

setValues(array){ 

const jsonVal = array; 
console.log('This is a surprise!!' + JSON.stringify(jsonVal.keys)); 


    jQuery.each(array, (key, value) => { 
    console.log('Jquery Output 1st' + key + ': ' + value.state); 
    console.log('Jquery Output 1st' + key + ': ' + value.serviceName); 
    console.log('Jquery Output 1st' + key + ': ' + value.domainName); 
    console.log('Jquery Output 1st' + key + ': ' + value.releaseVersion); 
    console.log('Jquery Output 1st' + key + ': ' + value.creationDate); 
    console.log('Jquery Output 1st' + key + ': ' + value.BI_SERVICE_URL); 
    console.log('Jquery Output 1st' + key + ': ' + value.editionDisplayName); 
    console.log('GEtting Essbase values' + JSON.stringify(value.components.BI.attributes.profile_essbase.value)); 
    this.services.push(new ServerProperties(JSON.stringify(value.serviceName), JSON.stringify(value.state), 
     JSON.stringify(value.domainName), JSON.stringify(value.releaseVersion), 
JSON.stringify(value.editionDisplayName), 
}); 
}

調用該函數！

<input type="text" 
     class="form-control" 
     [(ngModel)]="serverName" 
> 
<button class="btn btn-primary pull-left" (click)="onCreateServer()">Get Details</button>

來源

2017-05-30 Raghavendra S S

如何填充'services'？你在更新嗎？ – Satpal

我打休息網址並獲得響應，我把響應JS對象。 –

在向靜態url響應中寫入新數據之前，先要清空'services array'。 – anoop

嘗試設置你的this.services = []每次調用onCreateServer（）這樣的

onCreateServer(){ 
this.serverCreationStatus = 'Server Instance Created! ' + this.serverName; 
    return this.http.get('http://127.0.0.1:5000/PodChecker/', {params: 
    {Podurl: this.serverName 
    }}).subscribe((response: Response) => { 
     this.services= []; 
//... more code

而不是你調用setValues方法之後。

希望這會有所幫助。

來源

2017-06-01 10:29:05 brijmcq

不行不行！ –

你可以顯示來自onCreateServer（）的日誌嗎？ – brijmcq

Angular 2在寫表格行而不是追加！目前使用* ngFor

回答

相關問題