Javascript 在Angular 2中可以从JS创建HTML项目吗？

我有一个简单的

GET

请求，它会显示一些数据

this.apiRequest.get(url)
.map(response => response.json())
.subscribe(response => {
    this.notes = response.notes

    loader.dismiss()
}, err => {
    loader.dismiss()
})

然后我这样展示：

<ion-item *ngFor="let note of notes" text-wrap>
    <!-- data -->
</ion-item>

主要问题是当有大量的

注释时

加载器会在显示所有项目之前解除

---

我需要在js中循环

ngFor

，然后从

HTML

隐藏加载程序或以某种方式禁用加载程序…

这不是您想要的，但希望能有所帮助

基本思想是为循环完成事件提供

ngFor

创建组件

import { Component, Input, Output, EventEmitter } from '@angular/core';
@Component({
   selector: 'islast',
   template: '<span></span>'
})
export class LastDirective {
   @Input() isLast: boolean;
   @Output() onLastDone: EventEmitter<boolean> = new EventEmitter<boolean>();
   ngOnInit() {
      if (this.isLast)
        this.onLastDone.emit(true); //you can hide loader from here this is last element in ngfor
   }
}

从'@angular/core'导入{Component，Input，Output，EventEmitter}；
@组成部分({
选择器：“islast”，
模板：“”
})
导出类指令{
@Input（）isLast：布尔值；
@Output（）onLastDone:EventEmitter=新的EventEmitter（）；
恩戈尼尼特（）{
if（this.isLast）
this.onLastDone.emit（true）；//您可以从这里隐藏加载程序这是ngfor中的最后一个元素
}
}

在html中

  <tr *ngFor="let sm of filteredMembers; let last = last; let i=index;" data-id="{{sm.Id}}">
     <td>
        <islast [isLast]="last" (onLastDone)="modalMembersDone()">