Question

我写了以下指令，因为显然source filtering缺少一个：

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();
        }
    }
}

正如你所看到的那样，我使用了低级＆＃34; el.nativeElement.innerHTML＆＃34;但它似乎意味着API＆＃34; renderer.setText＆＃34;电话也应该工作。相反，它根本没有效果。

问题：为什么？应该怎么做setText调用？额外奖励：代码是否有问题，或者有一个很好的理由ng2-translate不包括一个？坏主意？

Answer 1

Renderer.setText was never meant to be used for elements, only for text nodes.

还有更多评论：

要执行此操作，只需使用elementRef.nativeElement.textContent = ... 直接

Answer 2

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

ng2-translate指令：为什么renderer.setText不起作用？

2 个答案: