ngx-translate стиль innerHTML

Я использую Angular 5.0.1 и ngx-translate / core 8.0.0

У меня есть этот код в шаблоне

<p [innerHTML]="'privacyAgree'|translate:{href:'#'}"></p>

и эта строка в en.json

"privacyAgree": "Clicking «Registration» button, I accept<a href=\"{{href}}\">the terms</a>"

и этот код в моем меньшем файле

p{
    color: #8A8C8D;
    font-size: 13px;
    line-height: 1.4em;
    a{
        color: #222222;
    }
}

но цвет для внутреннего "a" не будет применяться, потому что Angular создает эти стили

p[_ngcontent-c3] {
  color: #8A8C8D;
  font-size: 13px;
  line-height: 1.4em;
}
p[_ngcontent-c3]   a[_ngcontent-c3] {
  color: #222222;
}

но ngx-translate создает этот код

<p _ngcontent-c3="">Clicking «Registration» button, I accept<a href="#">the terms</a></p>

а тег "a" не имеет необходимого атрибута.

Итак, как я могу визуализировать шаблон [innerHTML] после перевода?


person Ruslan    schedule 21.11.2017    source источник


Ответы (1)


Вы должны изменить Encapsulation режим вашего компонента.

Проверьте этот вопрос, у него была аналогичная проблема.

Инкапсуляция

person Bunyamin Coskuner    schedule 18.12.2017