Question

我正在使用Angular js和FireBase为我的数据库开发一个Web应用程序。在网络应用程序中，我有一个地图，其中有针脚作为标记（经度和海拔高度）的位置。这些引脚将保存在数据库中。我的问题是我想从数据库中读取这些数据（经度和海拔高度）到我的角应用程序中，这样我就可以用引脚来显示那些位置的地图。

这里是角度js中的代码请帮帮我

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  lat: number = 37.8044444;
  lon: number = -122.2697222;
  zoom: number = 14;

// reading from database should be here

/*
  markers: marker[] = [
    {
      lat: 37.808211,
      lng: -122.291479
    },
    {
      lat: 37.780755,
      lng: -122.279205
    },
    {
      lat: 37.791391,
      lng: -122.250624
    },
    {
      lat: 37.8044444,
      lng: -122.2697222
    }
  ];
*/
}
//......................................................
this is the HTML file for the page that I want to present on the browser
//................................
<body>
<button type="button" class="btn btn-lg btn-outline-primary" (click)="open()">Submit</button>
<div class="map-container">
  <sebm-google-map [latitude]="lat" [longitude]="lon" [zoom]="zoom">
    <sebm-google-map-marker *ngFor="let m of markers" [latitude]="m.lat" [longitude]="m.lng">
    </sebm-google-map-marker>
  </sebm-google-map>
</div>
</body>
//.............................................
this is the app.Module.ts file
//............................................
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AgmCoreModule } from 'angular2-google-maps/core';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    AgmCoreModule.forRoot({
      apiKey: 'AIzaSyBgWMmOaSJ4YT1BNWKrfnpR2vn-0ntfqhM'
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
//...............................................

将数据从FireBase数据库读入angular4

0 个答案: