Question

我最近从Angular 1切换到Angular2，我需要澄清一些事情。

我有这段代码。

import { Component, EventEmitter, ElementRef } from '@angular/core';

@Component({
  selector: 'google-maps',
  template: `<div id="map"></div>`
})

export class GoogleMaps{
  maps_key : string = "1234string1234";
  visible : boolean = false;

  constructor(element : ElementRef) {
    GoogleMapsService.load().then(() => {
      this.visible = true;
      console.log('maps is ready to show');
    });
  }


}

class GoogleMapsService{

  static script;

  static load(){
    return new Promise((resolve) => {
      if(!GoogleMapsService.script){
        GoogleMapsService.script = document.createElement('script');
        GoogleMapsService.script.src = '//maps.googleapis.com/maps/api/js?key=**SET_KEY_HERE**';
        document.body.appendChild(GoogleMapsService.script);
        resolve(true);
      } else {
        resolve(true);
      }
    });
  }

}

如何将来自GoogleMaps类的maps_key字符串传递给GoogleMapsService SET_KEY_HERE

Answer 1

您可以将其传递给load这样的功能

import { Component, EventEmitter, ElementRef } from '@angular/core';

@Component({
  selector: 'google-maps',
  template: `<div id="map"></div>`
})

export class GoogleMaps{
  visible : boolean = false;

  constructor(element : ElementRef) {
    GoogleMapsService.load().then(() => {
      this.visible = true;
      console.log('maps is ready to show');
    });
  }


}

class GoogleMapsService{

  static script;
  static maps_key : string = "1234string1234";

  static load(){
    return new Promise((resolve) => {
      if(!GoogleMapsService.script){
        GoogleMapsService.script = document.createElement('script');
        GoogleMapsService.script.src = `//maps.googleapis.com/maps/api/js?key=${GoogleMapsService.maps_key}`;
        document.body.appendChild(GoogleMapsService.script);
        resolve(true);
      } else {
        resolve(true);
      }
    });
  }

}

Angular2 Typescript将字符串传递给url字符串

1 个答案: