ngx-google-translate-ui
v2.0.0
Published
Angular Material Google Translate UI
Downloads
43
Maintainers
Readme
ngx-google-translate-ui
Angular Material UI library for Google Translate based on Google Cloud Translation API.
Features
- Text translation
- Auto language detection
- Multiple language translation
- Fast and reliable – uses the Google translate servers
- Copy translation result copied to clipboard per language or
- Copy all translations to clipboard as raw JSON data
Install
npm install ngx-google-translate-ui
Usage
Google Translation API key is required to use this library. Google cloud console
The translation process is analogous to Google Translate.
Standalone component
<ngx-google-translate-ui></ngx-google-translate-ui>
Library can be used as an standalone component without requiring any input values.
Dialog component
This library can be used as a dialog component.
Use INgxGoogleTranslateUiDialogData
interface to provide initial dialog data.
import { NgxGoogleTranslateUiComponent } from 'ngx-google-translate-ui';
openDialog () {
const dialogConfig: INgxGoogleTranslateUiDialogData = {
googleApiKey: '<YOUR_GOOGLE_API_KEY>',
translationText: 'How you doin?'
};
const dialogRef = this.dialog.open(NgxGoogleTranslateUiComponent, {
data: dialogConfig,
minWidth: '600px'
})
}
Google translation service
Library exports GoogleTranslationService
so it can be used separately from
components.
The getTranslation$
method is used to fetch translations. It requires three
parameters:
- apiKey - User's Google API key.
- targetLang - Language code used in translation - ISO-639 codes.
- text - Text to translate - one or multiple strings.
- errorCallback - Optional, custom error callback function. Defaulted to snackbar message and rethrow error.
import { GoogleTranslationService } from 'ngx-google-translate-ui';
constructor (private googleTranslationService: GoogleTranslationService){}
this.googleTranslationService.getTranslations$(
'<YOUR_GOOGLE_API_KEY>',
'en',
['Whats up?', 'Nothing much!']
)
Exposed resources
Following resources can be imported from library:
- NgxGoogleTranslateUiModule
- Exports the NgxGoogleTranslateUiComponent
- NgxGoogleTranslateUiComponent
- Used outside templates
- INgxGoogleTranslateUiDialogData
- Used when component is a dialog component
- GoogleTranslationService
- Fetching Google translations
- IGoogleTranslationsData
- The response of fetching translations
- IGoogleTranslation
- The Google translations object
Contributing
Contributions are welcome!
License
Apache License
Copyright (c) 2023 Dino Klicek