在Angular 2/5中导入非模块外部JavaScript库

时间:2018-03-19 09:41:41

标签: javascript angular

我用Google搜索了这个问题&再一次,但我无法找到实际的解决方案。

有没有办法在Angular 2/5中获取外部JavaScript图书馆?

javascript库就像

import * as Kakao from 'http://developers.kakao.com/sdk/js/kakao.min.js';

(不能在Angular component.ts中实现)

我试过了:

constructor() {
    this.loadAPI = new Promise((resolve) => {
    this.loadScript();
    resolve(true);
  });
}

public loadScript() {
let isFound = false;
const scripts = document.getElementsByTagName('script');
for (let i = 0; i < scripts.length; ++i) {
  if (scripts[i].getAttribute('src') != null && 
    scripts[i].getAttribute('src').includes('loader')) {
    isFound = true;
  }
}

if (!isFound) {
  const dynamicScripts = ['http://developers.kakao.com/sdk/js/kakao.min.js'];

  for (let i = 0; i < dynamicScripts.length; i++) {
    const node = document.createElement('script');
    node.src = dynamicScripts[i];
    node.type = 'text/javascript';
    node.async = false;
    node.charset = 'utf-8';
    document.getElementsByTagName('head')[0].appendChild(node);
  }
}

但这不适用于此代码在* .component.ts或* .d.ts中的任何地方。

Kakao.init('some_string');
function() { Kakao.doSomething(); }

这与第一段代码一样无效。

我也尝试过:

{{1}}

这样做有效,但我相信这个解决方案无法从库中获取对象&#39; Kakao&#39;。

换句话说,我需要在加载后调用代码:

{{1}}

请帮忙!

0 个答案:

没有答案