Cannot match any routes. URL Segment: 'chat'


#1

trying to navigate to a page called “chat” but when i tab the navigation button i receive this error

JS: ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: ‘chat’
JS: Error: Cannot match any routes. URL Segment: ‘chat’


#2
import { Component, OnInit } from "@angular/core";
import { ObservableArray } from "tns-core-modules/data/observable-array/observable-array";
import * as app from "tns-core-modules/application/application";
import { TabView, SelectedIndexChangedEventData, TabViewItem } from "tns-core-modules/ui/tab-view/tab-view";
import { RadSideDrawer } from "nativescript-ui-sidedrawer";
import { isAndroid } from "tns-core-modules/platform/platform";
import { RouterExtensions } from "nativescript-angular/router";

@Component({
    selector: "Profile",
    moduleId: module.id,
    templateUrl: "./profile.component.html"
})
export class ProfileComponent implements OnInit {
    public countries: ObservableArray<any>;
    private _title: string;

    constructor(private routerExtensions: RouterExtensions,) {

        // Use the component constructor to inject providers.
}

    public goBack() {
        this.routerExtensions.backToPreviousPage();
    }
    public tabSelectedIndex: number;


    ngOnInit(): void {

        // Init your component properties here.

    }



    onDrawerButtonTap(): void {

        const sideDrawer = <RadSideDrawer>app.getRootView();

        sideDrawer.showDrawer();

    }
    get title(): string {
        return this._title;
    }

    set title(value: string) {
        if (this._title !== value) {
            this._title = value;
        }
    }

    getIconSource(icon: string): string {
        return isAndroid ? "" : "res://tabIcons/" + icon;
    }

    onSelectedIndexChanged(args: SelectedIndexChangedEventData) {
        const tabView = <TabView>args.object;
        const selectedTabViewItem = tabView.items[args.newIndex];

        this.title = selectedTabViewItem.title;
    }

  


    // << binding-tab-view-code
   

    
    public followTap() {
        console.log("follow button");
    }

    public onItemTapFirstList(args) {
        console.log(args.index);
    }

    public onItemTapSecondList(args) {
        console.log(args.index);
    }

    chat() {
        this.routerExtensions.navigate(["/chat"], {
            transition: {
                name: "flip",
                duration: 2000,
                curve: "linear"
            }
        });
    }
  

}

#3
import { NgModule } from "@angular/core";
import { Routes } from "@angular/router";
import { NativeScriptRouterModule } from "nativescript-angular/router";

import { ProfileComponent } from "./profile.component";
import{ChatComponent} from "../chat/chat.component";

const routes: Routes = [
    { path: "", component: ProfileComponent },
    { path: "chat", component: ChatComponent },
];

@NgModule({
    imports: [NativeScriptRouterModule.forChild(routes)],
    exports: [NativeScriptRouterModule]
})
export class ProfileRoutingModule { }


#4

module.ts

import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptCommonModule } from "nativescript-angular/common";
import { ProfileRoutingModule } from "~/profile/profile-routing.module";
import { ProfileComponent } from "~/profile/profile.component";
import { ChatComponent } from "~/chat/chat.component";
@NgModule({
    imports: [
        NativeScriptCommonModule,
        ProfileRoutingModule
    ],
    declarations: [
        ProfileComponent,
        ChatComponent,
    ],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class ProfileModule { }