javascript - Angular 7 ako zahrnúť inline JS skript do komponentu?


Chcel by som nainštalovať knižnicu places.js do môjho projektu Angular 7, ale mám problém. Do svojho súboru 'index.html' som zahrnul nasledujúci skript

 <script src="https://cdn.jsdelivr.net/npm/[email "></script>
  <script>
    var placesAutocomplete = places({
      appId: 'myAppId',
      apiKey: 'myApiKey',
      container: document.querySelector('#addressInput')
    });
  </script>

ale funguje to iba keď mám

<input type="search" id="address-input" placeholder="Where are we going?" />

v mojom 'index.html'. Skúsil som zahrnúť tento vstup do mojej komponenty, ale nefunguje to a mám chybu

[email :1 Uncaught Error: Algolia Places: 'container' must point to an <input> element.

Je možné pripojiť tento skript a spustiť ho? V dokumentácii nie je nič o TypeScripte. Skúšal som aj npm install a

import * from 'places.js'

ale mám rovnaký problém. Mohol by mi niekto pomôcť?

Odpoveď č. 1

Lepšie je ho použiť zabudovaný v Angular komponente:

import { Component, OnInit } from "@angular/core";
import places from "places.js";

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent implements OnInit {
  title = "my-app";

  ngOnInit(): void {
    const placesAutocomplete = places({
      appId: "appId",
      apiKey: "appKey",
      container: document.querySelector("#address-input")
    });
  }
}

toto by ste mali tiež umiestniť do svojho polyfill.js, aby to fungovalo:

(window as any).process = {
  env: { DEBUG: undefined }
};

(window as any).global = window;

Odpoveď č. 2

Skúsil som váš spôsob, ale neúspešne.

Musíte stiahnuť súbor places.js a umiestniť ho do priečinka so skriptmi.

Aktualizujte súbor angular.json v časti builder > scripts

 "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        ...
        "assets": [...],
        "styles": [...],
        "scripts": [
          "script/places.js"
        ]
      },