javascript - Angular 7 como incluir script JS inline em um componente?
Eu gostaria de instalar a biblioteca places.js no meu projeto Angular 7, mas tenho um problema. Incluí o seguinte script no meu arquivo 'index.html'
<script src="https://cdn.jsdelivr.net/npm/[email "></script>
<script>
var placesAutocomplete = places({
appId: 'myAppId',
apiKey: 'myApiKey',
container: document.querySelector('#addressInput')
});
</script>
mas está funcionando apenas quando eu tenho
<input type="search" id="address-input" placeholder="Where are we going?" />
no meu 'index.html'. Eu tentei incluir esse input no meu componente, mas não está funcionando e estou recebendo um erro
[email :1 Uncaught Error: Algolia Places: 'container' must point to an <input> element.
É possível anexar este script e fazê-lo funcionar? Na documentação não há nada sobre TypeScript. Eu também tentei fazer npm install e
import * from 'places.js'
mas tenho o mesmo problema. Alguém poderia ajudar?
Resposta #1
Melhor usá-lo incorporado em um Componente 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")
});
}
}
você também deve colocar isso no seu polyfill.js para fazê-lo funcionar:
(window as any).process = {
env: { DEBUG: undefined }
};
(window as any).global = window;
Resposta #2
Eu tentei do seu jeito, mas não obtive sucesso.
Você precisa baixar o arquivo places.js e colocá-lo em uma pasta de scripts.
Atualize o arquivo angular.json em builder > scripts
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
...
"assets": [...],
"styles": [...],
"scripts": [
"script/places.js"
]
},
