如何使用角度5在Google地图上显示多个路径？

Question

我正在尝试在角度5中使用“ AgmDirectionModule”和“ AgmCoreModule”在Google地图上显示多条路径。

如何保存多个起点和目的地并在地图上显示路径？

我的component.ts如下：

import { Component, ViewChild } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'Google Map';
    //lat: number = 28.4595;
    //lng: number = 77.0266;
    public origin: any=[]
    public destination: any=[]
    public source = [
        {lat :18.506307, lng : 73.8983345},
        {lat :18.461210, lng : 73.8773918}
        ];
    public dest = [
        {lat :18.500284, lng: 73.8588523},
        {lat :18.499796, lng: 73.8585090}
        ]
    ngOnInit() {
      this.getDirection()
    }

    getDirection() {

        for (var i = 0; i <= 1; i++) {
            this.origin = {lat: this.source[i].lat, lng: this.source[i].lng};
            this.destination = { lat: this.dest[i].lat, lng: this.dest[i].lng };
        }

    }
}

我的component.html

<style type="text/css">
  agm-map {
    height: 400px;
    width: 600px;
  }

</style>

<h1>{{ title }}</h1>
<agm-map [latitude]="lat" [longitude]="lng">
      <agm-direction [origin]="origin" [destination]="destination">
      </agm-direction>
</agm-map>