Может ли директива углового атрибута заменить родительские и дочерние элементы?

Question

Может ли директива углового атрибута заменить родительские и дочерние элементы?

Это то, что я имею в виду. Могу ли я создать одну директиву, которая заменит «родительские стили» и «дочерние стили» ниже

<div class="parent-stylings">
    <div class="child-stylings"></div>
</div>

на что-то вроде

<div #myCustomDirective></div>

Answer 1

Да, вам просто нужно изменить селектор компонента. Это так просто.

@Component({
  selector: '[myCustomDirective]',
  template: `
<div class="parent-stylings">
    <div class="child-stylings"></div>
</div>`
}) export class MyComponent {}

Смотрите, как работает вживую!