角2 - 結合

Question

私は時間と顧客の2つのオブジェクトを持っています。両方のオブジェクトで

this.customer = Customers[] 
this.hour = Hours[] 

私は、CUSTOMER_IDフィールドを持っている - 今私は、顧客リストからCUSTOMER_NAMEと組み合わせる時間のリストから詳細を含む新しいリストを作成したいです。

this.hourswithcustomers[] = ? 

これらの2つのオブジェクト/リストを新しいリストに追加すると、次の結果が得られます。

| hour.hour_id | hour.hour_amount | hour.customer_id | customer.customer_name | 
| 1   | 500.00   | 99    | microsoft    | 
| 2   | 300.00   | 55    | apple     | 
| 3   | 200.00   | 99    | microsoft    | 

Answer 1

2つをマージする最も簡単な方法は、customerIDカスタマーのマップの組み合わせです。そこから、時間をかけてループしてhourswithcustomersオブジェクトを移入することができます。あなたはそのようにそれを表示することができ、あなたのビューで

var customerMap = {}; 
this.customer.forEach((customer) => { 
    customerMap[customer.customer_id] = customer; 
}) 

this.hourswithcustomers = this.hour.map((hour) => { 
    return { 
     hour: hour, 
     customer: customerMap[hour.customer_id] 
    }; 
}); 

：データのマッピング

<tr *ngFor="let hwc of hourswithcustomers"> 
    <td>{{hwc.hour.hour_id}}</td> 
    <td>{{hwc.hour.hour_amount }}</td> 
    <td>{{hwc.hour.customer_id}}</td> 
    <td>{{hwc.customer.customer_name}}</td> 
</tr> 

Answer 2

私はこれが動作するかわからないが、多分これを試してみてください：find()はIDを持つ顧客を見つける方法をある

<tr *ngFor="let h of hourswithcustomer"> 
    <td > {{h.hour.hour_id}}</td> 
    <td > {{h.hour.hour_amount }}</td> 
    <td > {{h.customer.customer_id}}</td> 
    <td > {{h.customer.customer_customername}}</td> 
</tr> 


this.hourswithcustomers = this.hours.map(hour => { 
    return {hour, customer: this.find(c.customerId)} 
}); 

。私はあなたのコードを知らないので、あなたがそれを見つける方法を発明することはできません。