在 ng2 智能表中使用管道与异步数据

问题描述

我尝试使用管道,但在我的管道内有异步数据: 我的烟斗:

import { Pipe,PipeTransform } from "@angular/core";
import { VehiculeService } from "app/pages/fleetManagement/services/vehicule.service";
import { map } from "rxjs/operators";
@Pipe({
  name: "convertVehicule"
})
export class ConvertVehiculePipe implements PipeTransform {
  public result: any;
  constructor(private vehicleService: VehiculeService) {}

  transform(value) {
    this.vehicleService
      .getVehicules()
      .pipe(
        map((data: any = []) => {
          let result;
          for (let j = 0; j < data.length; j++) {
            if (value === data[j].id) {
              result = data[j].registration_number;
            }
          }
          return result;
        })
      )
      .subscribe(
        (data: any = []) => {
          console.log(data);
          this.result = data;
        },//   },error => {
          console.log(error);
        }
      );
    console.log(this.result);
    return this.result;
  }
}
}

在我的组件中:


 this.settings = { ...,vehicule_fleet_id: {
          title:"vehicle id",type: "html",editor: {
            type: "custom",component: SelectAssuranceComponent
          },valuePrepareFunction: cell => {
            let formated = this.convertVehiclePipe.transform(cell);
            return formated;
          }
        }
      }

我做了这个但是console.log(this.result)是undefined,我不知道是不是时间问题是因为valuePrepareFunction是直接渲染的,还是问题出在pipe函数上,正好是里面的变量作用域订阅 observable 和订阅

解决方法

我找到了解决方案,显然我们不能在管道内使用服务,所以我只是从管道中删除了服务并在组件中调用它: 在我的管道中:

Table1
id,info
--------
 1,info1
 2,info2
 3,info3

在 ngOninit 中:

transform(value,data) {
let result;
console.log(value);
console.log(data);
for (let j = 0; j < data.length; j++) {
  if (value === data[j].id) {
    result = data[j].registration_number;
    console.log(result);
  }
}
console.log(result);
return result;
 }

在 valuePrepareFunction :

   ngOnInit(): void {
    this.vehiculeService.getVehicules().subscribe(data => {
      this.vehicleData = data;
    })
     };

它工作得很好,希望对某人有帮助