Question

我有一个异步加载gmaps api的服务。当我加载它时，我在该服务中保存了一个属性名称＆＃34; isGoogleMapLibraryLoaded＆＃34;设定为真。

当我去另一条路线（当然没有刷新）并回到之前的时候，服务得到重新实施，我丢失了＃34; isGoogleMapLibraryLoaded＆＃34;属性。

如何设置在路由之间切换时仍然存在的服务中的属性？

我的服务：

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

const GOOGLE_MAPS_API_KEY = 'AIzaSyDvo543530SU_xsZLvZ6SjTFbt1FPW9FI';
const URL = `https://maps.googleapis.com/maps/api/js?key=${GOOGLE_MAPS_API_KEY}&callback=__onGoogleMapLoaded`;

@Injectable()
export class GoogleMapService {
  /**
   * Google maps loading status (althought loading is not completed)
   */
  private isGoogleMapLibraryLoaded: Boolean = false;
  constructor(){
  }

  getNewMapInstance(element, props){
    console.log(this.isGoogleMapLibraryLoaded);
    this._loading().then(() => {
      return new google.maps.Map(element, props);
    });
  }

  private _loading(){
    return new Promise((resolve, reject) => {
      if(!this.isGoogleMapLibraryLoaded){
        this.isGoogleMapLibraryLoaded = true;

          resolve();

      }else{
        resolve();
      }
    });
  }
}

我在bootstrap中添加了服务，并且我在组件构造函数

中注入了它

构造函数（private mapService：GoogleMapService）{}

ngAfterViewInit() {
    this.googleMapInstance = this.mapService.getNewMapInstance(this.googleMapWrapperElement.nativeElement, {
      center: {lat: -34.397, lng: 150.644},
      scrollwheel: false,
      zoom: 8
    });
  }

Answer 1

这取决于您提供服务的位置。如果您在根组件中提供它，则实例将与根组件一样长（只要您的Angular应用程序正在运行，就等于。）

如果您在路由组件中提供它，则一旦删除组件，它就会被丢弃。

Angular2服务在更改路由时重新实例化

1 个答案: