Как изменить глифик по событию клика?

Question

Я пытаюсь изменить глификон по событию клика.Из консоли я узнал, что классы установлены неправильно.

Из элемента Inspect *

<span _ngcontent-c2="" class="glyphicon-menu-up" ng-reflect-klass="glyphicon glyphicon-menu-up ar" ng-reflect-ng-class="[object Object]"></span>

Это код, который я сделал в части HTML.

КОД:

<ul class="nav third-nav">
    <li appExpandMenu (click)="isCollapsedA=!isCollapsedA">
        <a>
            <span [ngClass] = "{'glyphicon glyphicon-menu-up arrow': !isCollapsedA, 'glyphicon glyphicon-menu-right arrow': isCollapsedA}" class="glyphicon glyphicon-menu-{{sign}} arrow"></span>
            <span class="third-menu-title">Docs</span>
        </a>
    </li>

<ul class="nav third-nav">
        <li appExpandMenu (click)="isCollapsedA=!isCollapsedA">
            <a>
                <span [ngClass] = "{'glyphicon glyphicon-menu-up arrow': !isCollapsedA, 'glyphicon glyphicon-menu-right arrow': isCollapsedA}" class="glyphicon glyphicon-menu-{{sign}} arrow"></span>
                <span class="third-menu-title">Docs</span>
            </a>
        </li>

Answer 1

Вы должны применить [ngClass] следующим образом:

[ngClass] ="isCollapsedA ? 'glyphicon glyphicon-menu-right arrow' : 'glyphicon glyphicon-menu-up arrow'"

Возможно, это код, который вам нужен.

https://stackblitz.com/edit/angular-ngclass-u5bzma?file=app%2Fapp.component.html