使用具有不確定的啓動一個管道值

Question

在我管的文件我有這樣的代碼

import { Pipe, PipeTransform } from '@angular/core'; 

@Pipe({ 
    name: 'search' 
}) 
export class SearchPipe implements PipeTransform { 

    transform(service: any, term: any): any { 
    if (term=== undefined) return service.filter(function(service){ 
     return service.product_name.toLowerCase().includes("rustic".toLowerCase()); 
    }) 

    return service.filter(function(service){ 
     return service.product_name.toLowerCase().includes(term.toLowerCase()); 
    }) 
    } 
} 

我在這個模板致電上述管：

<div class="searchresult" *ngFor="let service of services |search:term "> 
       <div [routerLink]="['/searchresult',service.product_name]" class="searchitem">ID : {{ service.product_name }}</div><br> 
      </div> 

如何知道service還沒有準備好。因爲在我的應用程序中，我想從遠程rest API搜索數據（在我的VPS託管中）。目前我需要等待大約30秒，然後鍵入要傳遞給管道的關鍵字。如果我在30秒之前輸入它，大多數搜索將失敗，並返回Cannot read property 'filter' of undefined。這是因爲其餘API尚未加載到服務中。如何知道我的服務尚未加載，所以我可以保持搜索輸入要禁止，直到服務準備使用...

每個幫助將是非常尊重....

Answer 1

聽起來像是你的變量services在啓動時是undefined？ 也許將它設置爲一個空陣列[]在應用程序啓動時。

但是，更改您的管道就像這樣，使其更加強大，以防止故障！

@Pipe({ 
    name: 'search' 
}) 
export class SearchPipe implements PipeTransform { 

    transform(services: any[], term: any): any { 
    if (!services || !services.length) return []; // check inputs first! 
    if (term === undefined) term = "rustic".toLowerCase(); 

    return service.filter(srvc => srvc.product_name.toLowerCase().includes(term.toLowerCase())) 
    } 
}