javascript - Angular 7 bagaimana cara memasukkan skrip JS inline ke dalam komponen?

Saya ingin menginstal pustaka places.js ke dalam proyek Angular 7 saya, tetapi saya memiliki masalah. Saya telah menyertakan skrip berikut ke dalam file 'index.html' saya

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

tetapi itu hanya berfungsi ketika saya memiliki

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

di 'index.html' saya. Saya sudah mencoba memasukkan input ini ke dalam komponen saya tetapi tidak berhasil dan saya mendapatkan error

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

Apakah mungkin untuk melampirkan skrip ini dan membuatnya berjalan? Dalam dokumentasi tidak ada yang tentang typescript. Saya juga sudah mencoba npm install dan

import * from 'places.js'

tapi mengalami masalah yang sama. Apakah ada yang bisa membantu?

Jawaban #1

Lebih baik menggunakannya tertanam dalam Komponen Angular:

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")
    });
  }
}

Anda juga harus menempatkan ini di polyfill.js Anda agar berfungsi:

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

(window as any).global = window;

Jawaban #2

Saya mencoba caramu tetapi tidak berhasil.

Anda perlu mengunduh file places.js dan meletakkannya di folder skrip.

Perbarui file angular.json di builder > scripts

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