Formarray缓慢渲染,同时以角度6加载大数据

时间:2018-09-26 06:26:34

标签: angular-reactive-forms angular-forms formarray

我正在使用angular6。那是因为我正在使用formarray加载动态表单。

Formarray包含超过100行的下拉框。加载大数据时,它会挂在浏览器上,这会花费更多时间来呈现数据。

该100行下拉列表包含州和城市列表。

用户在编辑时,我必须在渲染的下拉菜单中显示所选的州和城市。

有什么方法可以提高formarray数据呈现的性能。

Component.html

 <Form [formgroup]="invest">
 <Div formArrayName="addinvest">
  <div *ngFor="let addinvest of invest.controls.addinvest.controls;let I= index>
   <div [formGroupName]="i">
    <select fromControlName="state">
     <option *ngFor="let state of states" [value]="state">{{state}}</option>
    </Select>
    <select fromControlName="state">
     <option *ngFor="let city of cities" [value]="city">{{city}}. 
  </option>
    </Select>
  </div>
 </div>
 </div>
 </form>

Component.ts

setStateControl(){
let control=<FormArray>this.invest.controls.addinvest;
This.statelist.foreach(x=> {
  Control.push(this.fb.group({
    state: x.state,
    City: x.city
  })
 }

在此之前,我已经加载了所有下拉列表。用户编辑from时,我必须在下拉菜单

中显示相应的值

注意:上面的代码段是示例。可能包含一些拼写错误。

0 个答案:

没有答案