1 | import { Directive, ElementRef, Input } from '@angular/core';
|
2 | import { isDefined } from './util';
|
3 | import { TranslateService } from './translate.service';
|
4 | export var TranslateDirective = (function () {
|
5 | function TranslateDirective(translateService, element) {
|
6 | var _this = this;
|
7 | this.translateService = translateService;
|
8 | this.element = element;
|
9 |
|
10 | if (!this.onTranslationChangeSub) {
|
11 | this.onTranslationChangeSub = this.translateService.onTranslationChange.subscribe(function (event) {
|
12 | if (event.lang === _this.translateService.currentLang) {
|
13 | _this.checkNodes(true, event.translations);
|
14 | }
|
15 | });
|
16 | }
|
17 |
|
18 | if (!this.onLangChangeSub) {
|
19 | this.onLangChangeSub = this.translateService.onLangChange.subscribe(function (event) {
|
20 | _this.checkNodes(true, event.translations);
|
21 | });
|
22 | }
|
23 |
|
24 | if (!this.onDefaultLangChangeSub) {
|
25 | this.onDefaultLangChangeSub = this.translateService.onDefaultLangChange.subscribe(function (event) {
|
26 | _this.checkNodes(true);
|
27 | });
|
28 | }
|
29 | }
|
30 | Object.defineProperty(TranslateDirective.prototype, "translate", {
|
31 | set: function (key) {
|
32 | if (key) {
|
33 | this.key = key;
|
34 | this.checkNodes();
|
35 | }
|
36 | },
|
37 | enumerable: true,
|
38 | configurable: true
|
39 | });
|
40 | TranslateDirective.prototype.ngAfterViewChecked = function () {
|
41 | this.checkNodes();
|
42 | };
|
43 | TranslateDirective.prototype.checkNodes = function (forceUpdate, translations) {
|
44 | if (forceUpdate === void 0) { forceUpdate = false; }
|
45 | var nodes = this.element.nativeElement.childNodes;
|
46 | for (var i = 0; i < nodes.length; ++i) {
|
47 | var node = nodes[i];
|
48 | if (node.nodeType === 3) {
|
49 | var key = void 0;
|
50 | if (this.key) {
|
51 | key = this.key;
|
52 | }
|
53 | else {
|
54 | var content = node.textContent.trim();
|
55 | if (content.length) {
|
56 |
|
57 | if (content !== node.currentValue) {
|
58 | key = content;
|
59 |
|
60 | node.originalContent = node.textContent;
|
61 | }
|
62 | else if (node.originalContent && forceUpdate) {
|
63 | node.lastKey = null;
|
64 |
|
65 | key = node.originalContent.trim();
|
66 | }
|
67 | }
|
68 | }
|
69 | this.updateValue(key, node, translations);
|
70 | }
|
71 | }
|
72 | };
|
73 | TranslateDirective.prototype.updateValue = function (key, node, translations) {
|
74 | var _this = this;
|
75 | if (key) {
|
76 | var interpolateParams = this.translateParams;
|
77 | if (node.lastKey === key && this.lastParams === interpolateParams) {
|
78 | return;
|
79 | }
|
80 | this.lastParams = interpolateParams;
|
81 | var onTranslation = function (res) {
|
82 | if (res !== key) {
|
83 | node.lastKey = key;
|
84 | }
|
85 | if (!node.originalContent) {
|
86 | node.originalContent = node.textContent;
|
87 | }
|
88 | node.currentValue = isDefined(res) ? res : (node.originalContent || key);
|
89 |
|
90 | node.textContent = _this.key ? node.currentValue : node.originalContent.replace(key, node.currentValue);
|
91 | };
|
92 | if (isDefined(translations)) {
|
93 | var res = this.translateService.getParsedResult(translations, key, interpolateParams);
|
94 | if (typeof res.subscribe === "function") {
|
95 | res.subscribe(onTranslation);
|
96 | }
|
97 | else {
|
98 | onTranslation(res);
|
99 | }
|
100 | }
|
101 | else {
|
102 | this.translateService.get(key, interpolateParams).subscribe(onTranslation);
|
103 | }
|
104 | }
|
105 | };
|
106 | TranslateDirective.prototype.ngOnDestroy = function () {
|
107 | if (this.onLangChangeSub) {
|
108 | this.onLangChangeSub.unsubscribe();
|
109 | }
|
110 | if (this.onDefaultLangChangeSub) {
|
111 | this.onDefaultLangChangeSub.unsubscribe();
|
112 | }
|
113 | if (this.onTranslationChangeSub) {
|
114 | this.onTranslationChangeSub.unsubscribe();
|
115 | }
|
116 | };
|
117 | TranslateDirective.decorators = [
|
118 | { type: Directive, args: [{
|
119 | selector: '[translate],[ng2-translate]'
|
120 | },] },
|
121 | ];
|
122 |
|
123 | TranslateDirective.ctorParameters = function () { return [
|
124 | { type: TranslateService, },
|
125 | { type: ElementRef, },
|
126 | ]; };
|
127 | TranslateDirective.propDecorators = {
|
128 | 'translate': [{ type: Input },],
|
129 | 'translateParams': [{ type: Input },],
|
130 | };
|
131 | return TranslateDirective;
|
132 | }());
|