填充构造函数的角度列表未在方法中定义答案

【问题标题】：Angular List Filled in constructor is Not defined in method填充构造函数的角度列表未在方法中定义
【发布时间】：2020-04-23 23:14:05
【问题描述】：

我有一个 Angular 9 组件，它在构造函数中注入了一个服务，并在构造函数中使用它来填充某个模型的列表，如下所示：

 export class translationtasksComponent implements OnInit { 
    usertaskslist: UserTaskType[];
    constructor( public service3: UserService) {   
    service3.getTasks().subscribe(res => { this.usertaskslist = res as UserTaskType[] });
     }  
    }

在同一个组件中，我有 2 种方法，我尝试使用之前的列表，如下所示：

 getFilteredUsers(options) {
        return {
          store: this.usertaskslist,
          filter: options.data ? ["taskTypeId", "=", options.data.userTaskTypeTaskTypeId] : null
        };
      }

 setUserValue(rowData: any, value: any) {
        .
        .
         console.log( this.usertaskslist)
        .
        .
      }

构造函数运行良好并填充列表。第一种方法也可以正常工作，但在第二种方法中，列表返回“未定义”。我尝试在 setUserValue 方法中再次调用该服务作为解决方法，但该服务也未定义且未被识别为服务。

注意：我使用 .net core 和 Angular 模板。

这 2 个方法是 dxDataGrid 从 DevExtreme 触发的事件。

【问题讨论】：

你什么时候触发第二种方法？有没有可能在您的订阅发出任何价值之前触发它？您还可以在订阅中放置一个 if 块，以检查 res 是否包含任何有效负载，然后再将其分配给您的类属性，因为它的异步性质。
构造函数先填充列表，并在html中很好的显示。之后，当我在 dxDataGrid 中编辑已经很好地显示列表的单元格值时，会触发第二种方法。但该列表在事件处理程序 (setUserValue) 中未定义。问题是如果我尝试在第二种方法中调用它，我什至无法订阅服务，因为它返回一个未定义的错误。

标签： angular devextreme angular9

【解决方案1】：

我找到了一个解决方案，但我不知道我是否了解它的所有方面。似乎在编辑 dxDataGrid 单元格时触发的触发事件 (setUserValue) 由于某种原因无法直接访问组件实例。但事实证明，我可以在构造函数中将组件实例传递给它，然后在我的处理程序中接收它并使用它。它工作得很好，如下所示：

constructor(public service3: UserService) {
    service3.getTasks().subscribe(res => { this.usertaskslist = res as UserTaskType[] });
    .
    .
   let that = this,
   origOnSetCellValue = this.setUserValue;
   this.setUserValue = function () {
     origOnSetCellValue.apply(this, [].slice.call(arguments, 0, 3).concat([that]));
   };

  }

.
.
setUserValue(rowData: any, value: any, currentData, componentInstance) {

    var currentUserId = currentData.userTaskTypeUserId;
    var currentTaskType = currentData.userTaskTypeTaskTypeId;
    var currentUserTask = componentInstance.usertaskslist;
}

【讨论】：