-
-
Notifications
You must be signed in to change notification settings - Fork 14
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):
- NativeScript-Angular: 16
- Angular: 16
Describe the bug
In angular 16, you can add bindToComponentInputs
to Angular's Router Module imports: [NativeScriptRouterModule.forRoot(routes, { bindToComponentInputs: true })],
to automatically populate @Input()
properties in the component. Doing so in Nativescript—Angular warns the dev
CONSOLE WARN: 'withComponentInputBinding' feature is enabled but this application is using an outlet that may not support binding to component inputs.
To Reproduce
Add bindToComponentInputs: true
to the forRoot function's 2nd parameter config object.
import { NgModule } from '@angular/core';
@NgModule({
imports: [NativeScriptRouterModule.forRoot(routes, { bindToComponentInputs: true })],
})
export class AppRoutingModule {}
export const testPageRoute: Route = {
path: ':page',
component: TestComponent ,
data: {'test': 'test-text'}
};
import { Component, Input, OnInit } from '@angular/core';
@Component({
selector: 'test-component',
templateUrl: './test-component.html',
})
export class TestComponent implements OnInit {
@Input() public test;
public ngOnInit(): void {
console.log(this.test); // should populate with 'test-text'
}
}
Expected behavior
this.test
should populate with the data from the route without having to query in the OnInit lifecycle.
Additional context
https://blog.angular.io/angular-v16-is-here-4d7a28ec680d#398f