在我的项目中,我有一个包含纬度和经度列表的数据库,对应于几个地址,我想从这个数据库中获取它们并使用Angular 2在Google Maps中绘制它们(带路径).
但是,我陷入了这个问题.我没有输出.我的代码看起来像这样.
但是,我陷入了这个问题.我没有输出.我的代码看起来像这样.
服务组件看起来像这样.
import { Injectable } from '@angular/core'; import {Http,Response,Headers,RequestOptions} from "@angular/http"; import { Observable } from 'rxjs/Observable'; import 'rxjs/add/operator/map'; @Injectable() export class HawkerserviceService{ baseUrl: string; constructor(private http: Http) { } fetchNews(): Observable<any> { return this.http.get('assets/data/locations.json') .map(response => response.json()); } }
我在家庭组件中调用它,看起来像这样
import { Component,OnInit } from '@angular/core'; import {Observable} from 'rxjs/Rx'; import {HawkerserviceService } from '../hawkerservice.service'; @Component({ selector: 'app-home',templateUrl: './home.component.html',styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { public latitude: number; public longitude: number; public places: any[]; constructor( private hawkerservice: HawkerserviceService) { } ngOnInit() { this.hawkerservice.fetchNews() .subscribe( data=> {this.places= data.locations},Error=> console.log('this.places') ); } }
我的HTML组件是
<li *ngFor="let location of places> <sebm-google-map [latitude]={{location.latitude}} [longitude]={{location.longitude}}> <sebm-google-map-marker [latitude]={{location.latitude}} [longitude]={{location.longitude}}></sebm-google-map-marker> </sebm-google-map> </li>
但我没有得到任何输出.
我的JSON数据看起来像这样
{ "locations": [ { "title": "Sangam Chowk","latitude": 27.692612,"longitude": 85.342982 },{ "title": "Kharikobot","latitude": 27.690227,"longitude": 85.342671 },{ "title": "Ace Instute Of management","latitude": 27.690693,"longitude": 85.339581 } ] }
做这个的最好方式是什么?
解决方法
确保路径.尝试使用类似’./assets/data/locations.json’的方式更改路径字符串(注意./)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。