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):
Start new project by following the docs: https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-angular.
{
"name": "example-app",
"main": "./src/main.ts",
"version": "1.0.0",
"private": true,
"dependencies": {
"@angular/animations": "~19.0.0",
"@angular/common": "~19.0.0",
"@angular/compiler": "~19.0.0",
"@angular/core": "~19.0.0",
"@angular/forms": "~19.0.0",
"@angular/platform-browser": "~19.0.0",
"@angular/platform-browser-dynamic": "~19.0.0",
"@angular/router": "~19.0.0",
"@nativescript/angular": "^19.0.0",
"@nativescript/core": "~8.8.0",
"rxjs": "~7.8.0",
"zone.js": "~0.15.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "~19.0.0",
"@angular/compiler-cli": "~19.0.0",
"@nativescript/android": "8.8.6",
"@nativescript/tailwind": "^2.1.0",
"@nativescript/types": "~8.8.0",
"@nativescript/webpack": "~5.0.0",
"@ngtools/webpack": "~19.0.0",
"tailwindcss": "~3.4.0",
"typescript": "~5.6.0"
}
}
Describe the bug
run ns debug android
and inspect element on devtools://devtools/bundled/inspector.html?ws=localhost:40000 no class active is added.
To Reproduce
After example-app create ns run android
modify app.component.html
<GridLayout rows="*,60">
<StackLayout row="0">
<page-router-outlet></page-router-outlet>
</StackLayout>
<StackLayout row="1" orientation="horizontal">
<Label text="Go to ID: 1" width="100%" backgroundColor="#43B3F4" textAlignment="center" [nsRouterLink]="['/item', '1']" nsRouterLinkActive="active"></Label>
</StackLayout>
</GridLayout>
Add css rule in app.css:
@tailwind base;
@tailwind components;
@tailwind utilities;
.active {
color: red;
}
Click on the buttom Go to ID: 1 at the bottom of the page button text doesn't change the colour
Expected behavior
Expected the button text to change colour to red.
Sample project
ns debug android
. and inspect element devtools://devtools/bundled/inspector.html?ws=localhost:40000, no class active is added.
Additional context
No much more context just couple of updates to the example-app to replicate the issue.