Ionic 6 – RouterLink vendor.js:51830 NG0303: Can't bind to 'routerLink' since it isn't a known property of 'ion-card'

Issue

I am using the Angular version of Ionic 6. I have a reusable component that shows a summary of an event. On tapping the component I would like to navigate it to a detail page. But I get the vendor.js:51830 NG0303: Can’t bind to ‘routerLink’ since it isn’t a known property of ‘ion-card’ error. Below is my code:

<ion-card *ngFor="let feed of feedData; let i = index" [routerLink]="['/detail/feed.id']">
    <ion-card-content>
     {{ feed.name }}          
    </ion-card-content>
    <p [innerHTML]="feed.feed"></p>
</ion-card>

For the component I am importing the following:

import { Component, OnInit } from '@angular/core';
import { FeedService } from './../../services/feed.service';

I am also importing RouterModule, Routes in the feed.module.ts.

The detail/:id route is registered in the app-routing.module.ts

Solution

Declare your component in the module of the page the component is being used for under declarations.

Answered By – techwestcoastsfosea

Answer Checked By – Candace Johnson (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.