Angular scss не работает $self из-за shadowcsshost?

Question

[quiplunar]

И так проблема заключается в том что в $self попадает :host .ui-input, так как & будет содержать :host .ui-button.

Angular запрещает использовать такую конструкцию:

:host {
     // code
     :host {
          // code
     }
}

И в css добавляет shadowcsshost:

Comments

[Михаил]

этот код вообще не работает

[quiplunar]

Михаил, Вы о чем?

[Михаил]

quiplunar, о коде

[quiplunar]

Михаил, В каком смысле? Я спрашиваю как сказать angular добавить hash в данный код:

#{self}__name{Тут ang не хочет добавлять hash} {}

.ui-new-star__name{А тут он hash добавляет} {}

[Михаил]

quiplunar, что ещё за hash ? $self: & это что блин

[quiplunar]

Михаил,
$self: &; - Это основы
hash - Собственно тоже

Answer 1

[quiplunar]

Решением данной проблемы является простая scss функция:

$self: self(&);

@function self($self) {
  @return selector-replace($self, ':host', '*');
}

Мы просто заменяем :host на *