8
是否有從Angular 2(TypeScript)中的組件調用JavaScript函數的正確方法?Angular 2 typecript調用javascript函數
這裏是我的組件:
import { ElementRef, AfterViewInit } from '@angular/core';
export class AppComponent implements AfterViewInit {
constructor(private _elementRef: ElementRef) {
}
ngAfterViewInit() {
/**
* Works but i have this error :
* src/app.component.ts(68,9): error TS2304: Cannot find name 'MYTHEME'.
* src/app.component.ts(69,9): error TS2304: Cannot find name 'MYTHEME'.
*/
MYTHEME.documentOnLoad.init();
MYTHEME.documentOnReady.init();
/**
* Works without error, but doesn't seem like a right way to do it
*/
var s = document.createElement("script");
s.text = "MYTHEME.documentOnLoad.init(); MYTHEME.documentOnReady.init();";
this._elementRef.nativeElement.appendChild(s);
}
}
調用直接導致編譯錯誤的JavaScript函數,但「編譯」 JavaScript文件中的語法(app.component.js)是正確的:
AppComponent.prototype.ngAfterViewInit = function() {
MYTHEME.documentOnLoad.init();
MYTHEME.documentOnReady.init();
};
第二種方式(appendChild)沒有錯誤,但我不認爲(改變從typescript /角度的DOM)是正確的方式來做到這一點。
我發現這一點:Using a Javascript Function from Typescript我想聲明的接口:
interface MYTHEME {
documentOnLoad: Function;
documentOnReady: Function;
}
但打字稿似乎並沒有認識到它(在接口聲明中沒有錯誤)。
感謝
編輯:
繼胡安·門德斯回答這是我結束了:
import { AfterViewInit } from '@angular/core';
interface MYTHEME {
documentOnLoad: INIT;
documentOnReady: INIT;
}
interface INIT {
init: Function;
}
declare var MYTHEME: MYTHEME;
export class AppComponent implements AfterViewInit {
constructor() {
}
ngAfterViewInit() {
MYTHEME.documentOnLoad.init();
MYTHEME.documentOnReady.init();
}
}
謝謝,它的工作原理! – Joshua
@Joshua你可以稍微詳細說明一下步驟,因爲我對打字稿很陌生,想從組件 –
@MBalajivaishnav裏面調用js函數。我的答案不是你問不相干問題的地方。請刪除此評論並添加一個新問題,我們不會在此處回收問題,以便每個問題都可以擁有自己的帖子,以便對其他人最有用。 –