3

我写了以下指令，因为显然ng2-translate缺少一个：

import { Directive, ElementRef, Renderer, OnDestroy } from '@angular/core';
import { TranslateService } from 'ng2-translate';
import { Subscription } from 'rxjs';

@Directive({selector: '[translate]'})
export class TranslateDirective implements OnDestroy {
    subscription: Subscription;

    constructor(el: ElementRef, renderer: Renderer, translateService: TranslateService) {
        let translateKey = el.nativeElement.attributes.translate.value;
        this.subscription = translateService.get(translateKey).subscribe(value => {
            el.nativeElement.innerHTML = value; // this works
            // renderer.setText(el.nativeElement, value); // this doesn't work for some reason?
        });
    }

    ngOnDestroy(): void {
        if (this.subscription) {
            this.subscription.unsubscribe();
        }
    }
}

正如你所看到的，我使用低级别的“el.nativeElement.innerHTML”让它工作，但 API 似乎暗示“renderer.setText”调用也应该工作。相反，它根本没有效果。

问：为什么会这样？setText 调用应该做什么？奖励：代码有问题还是 ng2-translate 不包含问题有充分的理由？馊主意？

4

2 回答 2

5

Renderer.setText从未打算用于元素，仅用于文本节点。

更多来自该评论：

为此，只需elementRef.nativeElement.textContent = ... 直接使用。

于 2016-12-25T15:36:00.173 回答
2

这似乎是@angular 2.2.0 中的一个重大变化。我刚刚从 2.1.0 升级后遇到了同样的问题。Renderer 类被列为实验性的，所以我想我们可以预料到一些不稳定性:( https://angular.io/docs/js/latest/api/core/index/Renderer-class.html

于 2016-11-29T19:30:57.010 回答