Question

我有两个数组，例如一个是城市，另一个是邮政编码

cities=[{name:"aaa"},{name:"bbb"},{name:"ccc"},{name:"ddd"}]
  zipcode=[{num:"111"},{num:"222"},{num:"333"},{num:"444"}]

如何链接两个数组。如果我使用两个forloops，则城市和邮政编码将变为两次。谁能帮忙我期望这样的输出 aaa-111 bbb-222 ccc-333 ddd-444

但是我没有得到预期的结果。我试过了 linkup array of data stackblitz

Answer 1

像这样更改您的html

function numberPrecision($number, $decimals = 0)
{
    $negation = ($number < 0) ? (-1) : 1;
    $coefficient = pow(10, $decimals);
    return $negation * floor((string)(abs($number) * $coefficient)) / $coefficient;
}

使用城市数组的索引来定位相应的邮政编码数组的元素。但是要执行此操作，您需要确保两个数组的长度相同，并且在两个数组中具有相同的索引引用相同的值

查看更新后的stackblitz

OR

您可以使用map在ngOnInit方法中组合两个数组，如下所示。

<li *ngFor="let x of cities;let i=index">
     <div class="form-group" (click)="City(x)">
        <label>{{x.name}}-{{zipcode[i].num}}</label>
     </div>              
</li>

然后在HTML中使用

ngOnInit () {        
    this.cities.map((x:any, i) => x.num = this.zipcode[i].num);
  }

Answer 2

既然已经有了索引，为什么不简单使用zipcode[i].num

类似这样的东西：

<div class="admin-page">
  <div class="row">
    <div class="col-md-12">
      <div class="row">
        <div class="co col-md-12">
          <li *ngFor="let x of cities;let i=index">
            <div class="form-group" (click)="City(x)">
              <label>{{x.name}}-{{zipcode[i].num}}</label>
            </div>
          </li>
        </div>
      </div>
    </div>
  </div>
</div>

以下是更新的Working Sample StackBlitz供您参考。

如何在HTML angular5中链接两个数组

2 个答案: