在 Angular v4 中，是否可以使用 Google 翻译 API 发送文本并接收翻译？

Question

如果是的话，怎么办？我正在学习网络应用程序的东西。我正在努力做一名翻译。我已经设置了 html 来接收输入字符串。但现在我不知道如何继续。我正在浏览 google 翻译 api 文档here，我看到了一些 Node 的东西，但我不确定这是否适用于 Angular。我应该导入什么？有朋友提到ajax请求，我该怎么办？

任何帮助或指向好的方向都会非常有帮助。谢谢！

Answer 1

 component.TS
......................................

ngAfterViewInit() {
        var v = document.createElement("script");
        v.type = "text/javascript";
        v.innerHTML = "function googleTranslateElementInit() { new google.translate.TranslateElement({ pageLanguage: 'en' }, 'google_translate_element'); } ";
        this.elementRef.nativeElement.appendChild(v);
        var s = document.createElement("script");
        s.type = "text/javascript";
        s.src = "//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";
        this.elementRef.nativeElement.appendChild(s);
    }

<div id="google_translate_element"></div>

Answer 2

这会让你更接近，使用 Angular HttpClient 发送带有参数的 Get，但你必须做额外的工作来加载 API 密钥并处理授权响应。请阅读前面提到的 Angular 教程。 https://angular.io/tutorial

https://stackblitz.com/edit/angular-httpclient-ex5

import { Component } from '@angular/core';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';

@Component({
 selector: 'my-app',
 templateUrl: './app.component.html',
 styleUrls: [ './app.component.css' ]
})

export class AppComponent  {
apiKey = ''
url = 'https://translation.googleapis.com/language/translate';
result: any;
q: any;

constructor(private http: HttpClient) {}  

translate(): void {
 let params = new HttpParams();
 params = params.append('q', this.q);
 params = params.append('target', 'es');
 params = params.append('key ', this.apiKey);

 this.http.get(this.url, {params: params})
   .subscribe(response => this.result = response);

}

Answer 3

来宾来宾 来宾来宾 来宾来宾客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人 客人