Chart.js устанавливает размеры холста равными 0x0 и ничего не отображает

Question

Я получил первый пример char.js из официальных документов и попытался реализовать его с помощью angular.Нет ошибок, объект диаграммы создается нормально, но ничего не отображается.Когда я проверяю DOM в devtools, я вижу, что chart.js устанавливает ширину / высоту холста равным 0. Что я сделал не так?

Код: https://stackblitz.com/edit/angular-chartjs-ex

Answer 1

Диаграмма не видна, поскольку узел компонента является элементом inline.Таким образом, он не должен содержать блочных элементов, таких как оболочка div, созданная библиотекой Chart.js.

Установка атрибута стиля display хоста на block или inline-block сделаетвидимая диаграмма:

:host {
  display: inline-block;
}

См. этот стек для демонстрации.