NgClass загружает только один класс из строки классов
Я использую ngClass (Angular 2) для загрузки строки классов, если условие истинно, и другой строки классов, если условие ложно!
Вот код:
<label [ngClass] = "{'btn btn-success m-btn m-btn--pill': value==2, 'btn btn-outline-success m-btn m-btn--pill': value!=2}" >
Нет проблем (но тот же код, что и первая часть в ngClass):
Вторая часть работает хорошо, когда условие - value!=2, а строка класса, которая должна быть загружена, - это btn btn-outline-success m-btn m-btn--pill.
Проблема:
Первая часть, где условие - это value==2, а строка классов, которая должна быть загружена, - это btn btn-success m-btn m-btn--pill, но единственный загруженный класс (из многих доступных в строке) - это btn-success.
Я не могу понять, почему ngClass загружает только один класс, оставляя другие классы в строке!
Может кто-нибудь, дайте мне знать, если я делаю что-то не так или это ошибка в angular 2?
Не могли бы вы решить, какую версию Angular вы используете?
@FDavidov Я использую Angular 2
В этом случае удалите нерелевантные теги, так как некоторые люди ищут вопросы на основе этих тегов и получают нерелевантные записи.
Ответы 1
Я знаю, что этот вопрос старый, но, по-видимому, все еще актуален в angular 7, поскольку я только что столкнулся с той же проблемой.
Каким-то образом angular требует, чтобы вы переместили общие классы между двумя операторами ng-class (где всегда одно или другое истинно) в атрибут класса. Иначе обычные в первой части утверждения не сработают.
Итак, решение проблемы выше:
<label class = "btn m-btn m-btn--pill" [ngClass] = "{'btn-success': value==2, 'btn-outline-success': value!=2}" >
Почему бы вам не переместить все обычные в атрибут обычного стиля?