角度2 - 加入

时间:2017-01-04 20:43:09

标签: angular typescript

我有两个对象 - 小时和客户。

<ul class="main-nav">
      <li id="page1"><a href="index.php">Index</a></li>
      <li id="page2"><a href="test1.php">test1</a></li>
      <li id="page3"><a href="test2.php">test2</a></li>
      <li id="page4"><a href="test3.php">test3</a></li>
    </ul>

.active {
  border: 1px solid #fff;
}

  switch (window.location.pathname) {
    case '/myfolder/index.php':
      $('.main-nav #page1').addClass('active')
    case '/myfolder/projects.php':
      $('.main-nav #page3').addClass('active')
    case '/myfolder/contact.php':
      $('.main-nav #page4').addClass('active')

    }

在这两个对象中,我有customer_id字段 - 现在我想创建一个新列表,其中包含小时列表中的详细信息以及客户列表中的customer_name。

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

如何将这两个对象/列表连接到新列表以获得以下结果?

this.hourswithcustomers[] = ?

2 个答案:

答案 0 :(得分:1)

我不确定这会有用,但也许可以尝试一下:

 <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)}
});

其中find()是一种查找具有id的客户的方法。我不知道你的代码我不能发明你如何找到它。

答案 1 :(得分:1)

合并这两者的最简单方法是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>