Question

在我的angular2项目中，我使用FileReader读取了一个csv文件。在onloadend回调之后，我有一个包含我的csv文件内容的变量。

这是我的component.ts：

items: Array<any> = []

...

readCSV (event) {
   let csvFileParseLog = this.csvFileParseLog;
   r.onloadend = function(loadedEvt) {
       devicesFile = files[0];
       let csvFileParseLog = [];
       parseDevicesCsvFile(contents) // One of my function which is an observable
           .subscribe(newItems=> {
               csvFileParseLog.push(newItems); // My result
           },
           exception => { ... }
       );
  };
}

我试图将csvFileParseLog绑定到我的观点，方法是将我的值传递给items ......但没有成功。

这是我的componentsnet.html：

<div *ngFor="let c of csvFileParseLog">
    {{ c.value }}
</div>

如何使用ngFor？

将此内容显示在我的视图组件中并在其上循环

Answer 1

r.onloadend = function(loadedEvt) {

应该是

r.onloadend = (loadedEvt) => {

否则this将无法在该功能中使用。

然后只需使用

this.csvFileParseLog.push(newItems);

然后放弃let csvFileParseLog = this.csvFileParseLog;

您可能还需要注入

constructor(private cdRef:ChangeDetectorRef) {}

并在subscribe()

中调用它

       .subscribe(newItems=> {
           this.csvFileParseLog.push(newItems); 
           this.cdRef.detectChanges();
       },

Angular2：使用回调变量绑定视图

1 个答案: