我使用下面的代码 . 这在index.html中有效
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Google Transliterate API
google.load("elements", "1", {
packages: "transliteration"
});
function onLoad() {
if (google.elements.transliteration.isBrowserCompatible()) {
var options = {
sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
destinationLanguage: [google.elements.transliteration.LanguageCode.SINHALESE],
shortcutKey: 'ctrl+g',
transliterationEnabled: true
};
// Create an instance on TransliterationControl with the required
// options.
var control =
new google.elements.transliteration.TransliterationControl(options);
// Enable transliteration in the textbox with id
// 'transliterateTextarea'.
control.makeTransliteratable(['transliterateTextarea']);
} else {
document.getElementById('errorDiv').innerHTML = 'Sorry! Your browser does not support transliteration';
}
}
google.setOnLoadCallback(onLoad);
</script>
在更改此代码之后 .
Ts Component
import { Component, OnInit } from '@angular/core';
declare var google:any;
@零件({
选择器:'app-root',
templateUrl:'./app.component.html',
styleUrls:['./app.component.css']})
export class AppComponent implements OnInit {
title = 'translate';
public sinhalaText: string;
constructor() {
google.load('elements','1', { packages: 'transliteration'});
google.setOnLoadCallback(this.onLoad);
}
ngOnInit() {}
onLoad() {
const sinhalOptions = {
sourceLanguage:
google.elements.transliteration.LanguageCode.ENGLISH,
destinationLanguage:
[google.elements.transliteration.LanguageCode.SINHALESE],
shortcutKey: 'ctrl+s',
transliterationEnabled: true
};
const tamilOptions = {
sourceLanguage:
google.elements.transliteration.LanguageCode.ENGLISH,
destinationLanguage:
[google.elements.transliteration.LanguageCode.TAMIL],
shortcutKey: 'ctrl+t',
transliterationEnabled: true
};
const sinhalaControl = new google.elements.transliteration.TransliterationControl(sinhalOptions);
const elements = document.getElementsByClassName('sinhalaText');> sinhalaControl.makeTransliteratable(elements);
// const sinhalaControl = new google.elements.transliteration.TransliterationControl(sinhalOptions);
// sinhalaControl.makeTransliteratable(this.sinhalaText);
}
}
html comonent
<textarea [(ngModel)]="sinhalaText" id="sinhalaText" style="width:600px;height:200px"></textarea>
index.html
<body>
<app-root></app-root>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
</body>
这不起作用 .
该代码适用于angular.html的index.html文件 . 但是我要求将代码嵌入到角度应用程序的组件内部 . 怎么样?
1 回答
请使用良好的livecyle函数:
AfterViewInit
等待HTML包含在DOM中 .在TS
在HTML中