Leaflet 弹出窗口上的角度2传单动态装订

我是angular2的新手。我有一个地图和一些制造商，我能够绑定到弹出内容的静态html代码

L.marker([long, lat], {
                  icon: L.icon({ iconUrl: 'assets/marker-icon.png', shadowUrl: 'assets/marker-shadow.png' })
                }).bindPopup(HTMLCONTENT).addTo(this.map);

为了使用

*ngFor

、

（单击）

或其他角度工具，我会在我的HTMLCONTENT中插入一个动态内容，因此我构建了一个新的角度组件，如以下几行所示

markerlink.components.ts

import {Component, Input} from '@angular/core';
import 'rxjs/add/operator/map';

@Component({
  selector: 'app-marker-link',
  templateUrl: './markerlink.template.html'
})
export class MarkerLinkComponent {

  @Input()
  points: any[] = [];

}

markerlink.template.html

<div *ngFor="let single of points">
  <a href="{{single.url}}">{{single.name}}</a>
</div>

在编译时，所有的工作都很好，当我转到索引时，会生成一个带有所有标记的映射，但当我单击其中一个标记时，会看到一个空的弹出窗口

可能是配置不正确，或者有其他方法可以做到这一点？

下面的代码中似乎输入了“HTMLCONTENT”

L.marker([long, lat], {
              icon: L.icon({ iconUrl: 'assets/marker-icon.png', shadowUrl: 'assets/marker-shadow.png' })
            }).bindPopup(HTMLCONTETN).addTo(this.map);

看见