Repository navigation
Button:highlighted stops working after 2nd click #4740
Description
I have a button which is in a custom component with the following template, and when I navigate to a page and back, the :highlighted styles only work the first 2 times.
<Button [nsRouterLink]="[link]" [row]="btnRow" [col]="btnCol" [colSpan]="btnColSpan" [rowSpan]="btnRowSpan" class="dash-btn"
[ngClass]="btnClass" #dashBtn>
<FormattedString>
<Span class="dash-btn-text" text="{{icon}}
" fontFamily="icomoon" fontSize="36"></Span>
<Span class="dash-btn-text" text="
" fontSize="5"></Span>
<Span class="dash-btn-text dash-btn-label" text="{{label}}"></Span>
</FormattedString>
</Button>
and scss
.dash-btn {
text-transform: uppercase;
font-size: 13;
font-family: $headingfont;
font-weight: bold;
.dash-btn-text {
background-color: transparent;
color: $darkblue;
}
&.dash-btn-grey {
background-color: $lightgrey;
}
}
.dash-btn:highlighted {
background-color: $darkgrey;
.dash-btn-text {
color: white;
}
}
tns v3.1.3
├── @angular/animations@4.2.6
├── @angular/common@4.2.6
├── @angular/compiler@4.2.6
├── @angular/core@4.2.6
├── @angular/forms@4.2.6
├── @angular/http@4.2.6
├── @angular/platform-browser@4.2.6
├── @angular/router@4.2.6
├── nativescript-angular@4.2.0
├── nativescript-dev-sass@1.3.0
├── nativescript-dev-typescript@0.5.0
├── nativescript-theme-core@1.0.4
├── reflect-metadata@0.1.10
├── rxjs@5.4.3
├── tns-core-modules@3.1.1
├── tslint@5.6.0
├── typescript@2.4.2
└── zone.js@0.8.16
Activity
NickIliev commentedon Aug 23, 2017
@dottodot thank you for logging this issue -I can confirm that the described scenario is valid and the highlighted selector is not working after page navigation on iOS (works as expected on Android).
Steps to reproduce:
dottodot commentedon Aug 27, 2017
@NickIliev Is there any kind of work around I can do until it's fixed? Just I'm on a bit of a deadline and would prefer not to have to publish with this issue if at all possible.
NickIliev commentedon Aug 29, 2017
Confirming this as a bug in NativeScript Core as well.
Demo project demonstrating the issue with the TypeScript template can be found [here](https://github.com/NickIliev/NativeScript-Issues-2017/tree/master/NativeScript/issue_4740_tsc
Once again the issue is reproducible only on iOS (works as expected on Android)
@dottodot we are currently investigating this issue so stay tuned for possible workarounds or fixes (all will be posted in this thread).
lock commentedon Aug 27, 2019
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.