angular - 您可以将 GET 方法中的数据分配给 Angular 8 中的外部变量吗？

Question

在下面的代码中，我试图将 testdata 的内容分配给 checkList 中的值。我遇到的问题是循环开始时 checkList 未定义。我似乎无法弄清楚如何解决这个问题，似乎无论我做什么 checkList 或 testdata 都是未定义的。

我是 Angular 的新手，我想知道这是否与 get 方法的异步属性有关？

  masterSelect: Boolean;
  checkList: any;
  fileNames$: any;
  testdata: string[];

  constructor(private http: HttpClient) { 
    this.checkList = [
      {id:1,value:'Section1',isSelected:false},
      {id:2,value:'Section2',isSelected:false},
      {id:3,value:'Section3',isSelected:false},
      {id:4,value:'Section4',isSelected:false},
      {id:5,value:'Section5',isSelected:false},
      {id:6,value:'Section6',isSelected:false},
      {id:7,value:'Section7',isSelected:false},
    ]

    this.fileNames$ = this.http.get<any>(this.baseUrl + "Invoice/GetFileNames").subscribe(function (data) {

      this.testdata = data;
      for (let i = 0; i < this.testdata.length; i++) {
        //console.log(this.testdata[i])
        this.checkList[i].value = this.testdata[i];

      }

    }, function (error) {
      this.testdata = error;
    });

    this.masterSelect = false;

  }

标签： angularhttpget

Answer 1

我认为，您可以将清单移动到订阅中。我的解决方案是：

constructor(private http: HttpClient) {

this.fileNames$ = this.http.get<any>(this.baseUrl + "Invoice/GetFileNames").subscribe(function (data) { 
this.checkList = [
  {id:1,value:'Section1',isSelected:false},
  {id:2,value:'Section2',isSelected:false},
  {id:3,value:'Section3',isSelected:false},
  {id:4,value:'Section4',isSelected:false},
  {id:5,value:'Section5',isSelected:false},
  {id:6,value:'Section6',isSelected:false},
  {id:7,value:'Section7',isSelected:false},
]

  this.testdata = data;
  for (let i = 0; i < this.testdata.length; i++) {
    //console.log(this.testdata[i])
    this.checkList[i].value = this.testdata[i];

  }

}, function (error) {
  this.testdata = error;
});

this.masterSelect = false;

}