如何在Ng Select中显示OPEN状态的referenceNumber？能否在GET方法中过滤？

Absolutely! You can absolutely filter the purchase orders directly in your getAllPurchaseOrders() method instead of adding conditions in the Ng Select component. This is actually a cleaner, more efficient approach—you’ll only pass the necessary data to your component, avoiding the need to load all records and filter them client-side later.

Step-by-Step Implementation #

Here’s how to modify your existing method to filter for only "OPEN" status orders:

Option 1: Using Promises

If your service uses toPromise() (common in older Angular versions), update the method like this:

async getAllPurchaseOrders() {
  // Fetch all purchase orders from the API
  const allOrders = await this.purchaseOrderService.getPurchaseOrders().toPromise();
  
  // Filter to retain only orders with purchaseOrderStatusName = "OPEN"
  this.formModel.schema.purchaseOrders['purchaseOrders'] = allOrders.filter(order => 
    order.purchaseOrderStatusName === "OPEN"
  );
}

Option 2: Using Observables (Modern Angular)

If you’re using Observables (the recommended approach), you can add the filter logic directly in the pipe:

getAllPurchaseOrders() {
  this.purchaseOrderService.getPurchaseOrders()
    .pipe(
      // Map the response to filter out non-OPEN orders
      map(allOrders => allOrders.filter(order => order.purchaseOrderStatusName === "OPEN"))
    )
    .subscribe(filteredOrders => {
      this.formModel.schema.purchaseOrders['purchaseOrders'] = filteredOrders;
    });
}

Why This Works Better #

• Cleaner Component Template: Your Ng Select can bind directly to the filtered array without any extra conditional logic in the template.
• Performance: You reduce the amount of data passed to the component, which helps with rendering speed, especially if you have a large number of purchase orders.
• Logic Centralization: Keeping the filtering logic in the data-fetching method makes your code easier to maintain—if you ever need to adjust the filter criteria, you only need to update this one place.

内容的提问来源于stack exchange，提问作者Angel Reji