Angular-多选下拉菜单-TypeError：无法读取未定义的属性“长度”

Question

  counter: number = 0;
  getDatatypes(){
    if(this.counter == 0) {
      if(this.appId != 0)
      {
        if(undefined != this.datatypes && this.datatypes.length)
          for (let i = 0; i < this.datatypes.length; i++) {
            this.applicationDataType = new ApplicationDataType(this.route.snapshot.params.id, this.datatypes[i].dataTypeId, this.datatypes[i].description, false);
            let datatype = this.checkedDatatypes.find(y => y.description === this.datatypes[i].description);
            if (datatype) {
              this.applicationDataType.checked = true;
              this.applicationDataTypes.push(this.applicationDataType);
            } else {
              this.applicationDataType.checked = false;
              this.applicationDataTypes.push(this.applicationDataType);
            }
        }
      } else {
        for(let i = 0; i < this.datatypes.length; i++){
          this.applicationDataType = new ApplicationDataType(this.route.snapshot.params.id, this.datatypes[i].dataTypeId, this.datatypes[i].description, false);
          this.applicationDataTypes.push(this.applicationDataType);
        }
      }
      this.counter ++;
    }
  }

线

if(undefined != this.datatypes && this.datatypes.length)

是给TypeError: Cannot read property 'length' of undefined的人。

这是我得到的控制台错误

这些错误对用户不可见，也不影响功能。我已经尝试了所有方法，但是前端多选下拉列表中的数据类型一直在消失。我尝试过初始化数据类型：Datatype[] = []，用if(this.datatypes && this.datatypes.length) 包装我的 for 循环，并使用 ?。这些只是在运行前端时使多选下拉列表为空。

Answer 1

似乎this.datatypes 不是一个数组或它的空值，你可以简单地用? 忽略这个错误。

请将其更改为if(this.datatypes?.length>0)

Answer 2

您可以尝试如下。初始化 dataTypes 数组，然后用 forEach 替换 for 循环，如下所示

counter: number = 0;
  datatypes = [];
  getDatatypes(){
    if(this.counter == 0) {
      if(this.appId != 0)
      {
        this.datatypes.forEach(dtype => {
          this.applicationDataType = new ApplicationDataType(this.route.snapshot.params.id, dtype.dataTypeId, dtype.description, false);
            let datatype = this.checkedDatatypes.find(y => y.description === dtype.description);
            if (datatype) {
              this.applicationDataType.checked = true;
              this.applicationDataTypes.push(this.applicationDataType);
            } else {
              this.applicationDataType.checked = false;
              this.applicationDataTypes.push(this.applicationDataType);
            }
        })
      } else {
        this.datatypes.forEach(dtype => {
          this.applicationDataType = new ApplicationDataType(this.route.snapshot.params.id, dtype.dataTypeId, dtype.description, false);
          this.applicationDataTypes.push(this.applicationDataType);
        })
      }
      this.counter ++;
    }
  }