Как передать имя класса в угловых из component.ts в HTML SVG

Question

Я использую d3 для создания графиков, и каждый график должен иметь уникальный идентификатор.

, поэтому мне нужно использовать что-то вроде:

<svg class="{{className}}"></svg>

className определено в component.ts, но это не работает

, оно работает, когда я жестко кодирую значение, но когда я передаю имя класса в значении, оно не работает

Answer 1

class="{{className}}" - это неправильный способ связать данные в шаблон в Angular 2+.И откройте консоль, чтобы увидеть, какую ошибку вы получили.

Вы должны прочитать Angular Document: https://angular.io/api/common/NgClass.

Использование <svg [ngClass]="className"></svg> должно работать для вас.

Проверка этого: Angular 2 добавляет значение к ngClass с интерполяцией , если вы хотите узнать больше с помощью ngClass и интерполяции.Проверка: https://angular.io/guide/displaying-data, чтобы увидеть, как правильно использовать интерполяцию.