2017-10-27 1 views
3

나는 각도가 매우 새롭다 고 생각하며 기본 문제라고 생각합니다.agm 표시가 ngfor에서 렌더링되지 않음

내가 만들어 내가 직접 마커를 설정

<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 루프가 실행되기 전에 맵이 렌더링된다는 문제가 있다고 믿는다. 루프가 먼저 실행되는지를 어떻게 확신 할 수 있는지, 또는 루프 후에 마커를 (재) 렌더링하도록 맵에 지시하는 방법을 확신 할 수 없다. 수행.

이 말은 아마도 매우 기본적인 것이지만 지금 당장은 고맙습니다. 감사합니다.

+0

정확한 문제가 있습니다. –

+0

위치 배열의 위도/경도가 숫자로 입력 되었습니까? latlng가 API에서 문자열로 반환되는 것과 유사한 문제가있었습니다. – Dale

+0

@Dale 실제로 문자열입니다. 번호로 바꿨고 지금은 작동합니다. 어떤 내게 조금 나에게 조금, 내게 그것은 lat와 lng가 html에 붙여지기 때문에 중요하지 않아 보이는 것처럼 보이므로 문자열인지 숫자인지는 중요하지 않습니다. p.s. 내가 확인 할 수 있도록 해줘야 해. – user3154108

답변

3

위도/경도는 숫자 유형이어야합니다. 그들이 API 나 어떤 종류의 서비스에서 문자열로 반환되는 경우 변환해야합니다. 내 경험에 의하면 숫자로 엄격하게 입력되도록 요구하는 것 같습니다.