Блог

У меня есть следующая структура html

https://stackblitz.com/edit/angular-bootstrap-4-starter-31tboc?file=src/app/testing-one/testing-one.component.html

Как вы можете видеть, здесь у меня есть вызываемый компонент app-testing-one , в котором я визуализирую некоторые данные.

Если я помещу свой компонент в col-7 ширину столбца, то он получит эту ширину, если я помещу его внутрь col-3 , то он будет меньше.

Но в моем случае, когда это col-3`, мне нужно отрисовывать свой компонент, чтобы он имел полную ширину корневого родителя.

Поэтому ниже i want this below to be fuyll width мне нужно отрисовывать свой компонент со 100% шириной.

Но мне не нужно делать это автоматически, не добавляя его в col-12.

Сделайте дочерний компонент display: block , затем установите width: 100%

напр.:

 :host {
  display: block;
  width: 100%;
}