小编use*_*108的帖子

我对角度很新,我认为这是一个基本问题.

我创建我的地图

<agm-map [latitude]="lat" [longitude]="lng">
    <agm-marker [latitude]="location.lat" [longitude]="location.lng" *ngFor="let location of locations; let i=index">
        <agm-snazzy-info-window [maxWidth]="200" [closeWhenOthersOpen]="true">
            <ng-template>
                <strong>{{location.title}}</strong>
                <p>adresse</p>
            </ng-template>
        </agm-snazzy-info-window>
    </agm-marker>
</agm-map>

当我手动设置标记时,一切正常,但是当我*ngFor用来遍历我的列表时,会创建标记的html,但显然在地图的脚本查找标记之后,所以没有标记被渲染(地图本身就是) .

从我的控制器:

export class LocationMapComponent implements OnInit {

 lat: number = 51.678418;
 lng: number = 7.809007;
 locations: Location[];

 async ngOnInit() {

}

public async getLocations()  {
    this.locations = await this._locationService.getLocations();

}

constructor(private _locationService:LocationService, private _coreCOMService: CoreCOMService, private _coreLanguageService: CoreLanguageService, private _coreLogService: CoreLogService, private _componentFactoryResolver: ComponentFactoryResolver, private _coreSystemService: CoreSystemService) {

    this.getLocations();
}

}

这些位置是从一个从远程数据库中获取它们的服务加载的.我确实认为问题是在执行ngFor循环之前渲染了地图,我不确定如何确保首先执行循环或者如何告诉地图仅在循环之后(重新)渲染标记已经完成了. …

我有一个奇怪的问题,可能我在这里遗漏了一些东西.

我得到了一个元素列表,其中一部分是可见的,另一部分是不可见的.

我想选择不可见部分的最后3个元素.我添加了一个剪切来说明问题.

我正在寻找的结果是在js运行后显示10,11,12,而不是1,2,3我认为slice(-3)会给我数组的最后3个元素,但似乎我遗漏了一些东西.我使用时会发生同样的问题filter(':gt(-4)').有人能解释一下我做错了什么吗？

jQuery(document).ready(function() {
  setTimeout(function () {
    var prevs = jQuery('li').filter(':visible').first().prevAll();
    var vis = jQuery('li').filter(':visible');
    
    vis.hide(1000);
    prevs.slice(-3).show(1000);
    
  }, 1000);
});

li:nth-last-child(n+4) {
  display: none
}

li {
  width: 30px;
  height: 30px;
  border: 1px dotted gray;
  background-color: red;
  list-style: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
  <li>7</li>
  <li>8</li>
  <li>9</li>
  <li>10</li>
  <li>11</li>
  <li>12</li>
  <li>13</li>
  <li>14</li>
  <li>15</li>
</ul>