how to use pipes with async data

i try to use pipe but inside my pipe there's async data :
my pipe :
```
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;
}
}
}
```

And in my component :
```

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;
}
}
}
```
I did this but the console.log(this.result) is undefined, i don't know if the problem is the timing because the valuePrepareFunction is rendred directly or the problem is in the pipe function, precisely the variable scope inside the subscription to the observable and outside the subscription