My problem is that the @Input() does not work properly for me. When I try to pass a value via data-binding it results in a NaN Error message.
I appreciate any form of help.
import { Component, Input, OnInit } from '@angular/core'; import { Router } from '@angular/router'; @Component({ selector: 'app-nav-button', templateUrl: './nav-button.component.html', styleUrls: ['./nav-button.component.scss'], }) export class NavButtonComponent implements OnInit { @Input() page: String; <-- results in NaN - message constructor(private router: Router) { } ngOnInit() {} goToPage(): void { console.log(this.page); this.router.navigate([this.page]); } }
My “View”. Here I pass the data to my “NavButtonComponent”-class.
<ion-content> <app-nav-button [page]="food-list"></app-nav-button> </ion-content>
Advertisement
Answer
The answer was <app-nav-button page="food-list"></app-nav-button>
.
Removing the [] was the solution. Thank you @cfprabhu !