Open
Description
Environment
Provide version numbers for the following components (information can be retrieved by running tns info
in your project folder or by inspecting the package.json
of the project):
- CLI: 6.3.0
- Cross-platform modules: 6.3.0
- Android Runtime: 6.3.0
- iOS Runtime: -
- Plugin(s): -
Describe the bug
The color of font icon in action bar is not changing after initial rendering of a page.
To Reproduce
I'm seeing this behaviour in a nativescript-angular app on Android.
HTML:
<ActionItem
icon="font://"
class="action-bar-icon"
[class.disabled]="someCondition()"
></ActionItem>
CSS:
.action-bar-icon {
color: #FFFFFF;
}
.disabled {
color: #666666;
}
Expected behavior
The color of icon in action bar should change from #FFFFFF
to #666666
when the condition changes.
Additional context
Currently the following workaround could be used:
<ActionBar (loaded)="onActionBarLoaded($event)">
onActionBarLoaded(event: any): void {
const actionBar = event.object;
someConditionObservable.subscribe(() => {
// Delay update so it will be done after class toggle
setTimeout(() => {
actionBar.update();
}, 0);
});
}