https://github.com/zixiaowang/angular4-translate
A translate module for Angular2/Angular4 Projects.
https://github.com/zixiaowang/angular4-translate
angular angular2 javascript typescript
Last synced: 24 days ago
JSON representation
A translate module for Angular2/Angular4 Projects.
- Host: GitHub
- URL: https://github.com/zixiaowang/angular4-translate
- Owner: ZixiaoWang
- License: mit
- Created: 2017-06-28T07:43:08.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-11-03T05:36:47.000Z (over 8 years ago)
- Last Synced: 2024-04-29T23:25:41.080Z (about 2 years ago)
- Topics: angular, angular2, javascript, typescript
- Language: JavaScript
- Size: 139 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# angular4-translate
A translate module for Angular2/Angular4 Projects.
### How to install it?
``` npm install --save angular4-translate ```
### How to use it?
Import ```TranslateModule``` and ```TranslateModule.forRoot(Dictionary)```
**app.module.ts**
```javascript
import { TranslateModule, TranslateService } from 'angular4-translate';
const dictionary: any = {
en: {
PHRASE: 'I was {{ event }} in {{ location }} at {{ time }}',
PARAMS: {
EVENT: 'studying',
LOCATION: 'library',
TIME:'saturday'
}
},
zh: {
PHRASE: '我{{ time }}在{{ location }}{{ event }}',
PARAMS: {
EVENT: '学习',
LOCATION: '图书馆',
TIME: '礼拜六'
}
}
};
@NgModule({
declarations:[...],
imports:[
...
TransalteModule.forRoot(dictionary),
...
],
providers:[...],
...
})
export class AppModule{
constructor( private translate: TranslateService ){
this.translate.setDefault('en');
}
}
```
#### Use Pipe
translate.html
```html
{{ 'PARAMS.EVENT' | translate }}
{{ 'PHRASE' | translate: { event: 'shopping', location: 'mall', time: 'Sunday' } }}
{{ 'PHRASE' | translate: params }}
```
translate.ts
```javascript
export class TranslateComponent{
params: any = {
event: 'Having Dinner',
location: 'KFC',
time: 'Tuesday'
}
}
```
#### Use Directive
translate.html
```html
```
translate.ts
```javascript
export class TranslateComponent{
params: any = {
event: 'Having Dinner',
location: 'KFC',
time: 'Tuesday'
}
}
```
#### Use Control Code
translate.html
```html
{{ translatedPhrase }}
```
translate.ts
```javascript
import { TranslateService } from 'angular4-translate';
export class TranslateComponent{
private translatedPhrase: string;
constructor( private translateService: TranslateService ){
this.translatedPhrase = this.translateService.instance('PHRASE', { event: 'sleep', location: 'home', time: 'midnight' });
}
}
```
### Effect
### TODO LIST
1. ~~Support Parameters in translating sentences;~~
2. ~~Support NativeScript Projects;~~
### License
[MIT](https://opensource.org/licenses/MIT)