সম্প্রতি, আমি কৌনিক 2 দিয়ে খেলতে শুরু করেছি এটি এখন পর্যন্ত দুর্দান্ত। সুতরাং, আমি ব্যবহার শিখার স্বার্থে একটি ডেমো ব্যক্তিগত প্রকল্প শুরু করেছি angular-cli।
বেসিক রাউটিং সেটআপ সহ, আমি এখন শিরোনাম থেকে কিছু রুটে চলাচল করতে চাই, তবে যেহেতু আমার শিরোনাম পিতামাতার router-outlet, তাই আমি এই ত্রুটিটি পেয়েছি।
app.component.html
<app-header></app-header> // Trying to navigate from this component
<router-outlet></router-outlet>
<app-footer></app-footer>header.component.html
<a [routerLink]="['/signin']">Sign in</a>এখন আমি আংশিকভাবে বুঝতে পারি যে অনুমান করা যায় যে যে উপাদানটি চারপাশে একটি মোড়ক হিসাবে router-outletএটি অ্যাক্সেস করা সম্ভব হবে না router। সুতরাং, এর মতো দৃশ্যের জন্য বাইরে থেকে নেভিগেশন অ্যাক্সেস করার কোনও সম্ভাবনা আছে কি?
প্রয়োজনে আরও কোনও তথ্য যুক্ত করতে আমি সত্যিই খুশি হব। তুমাকে অগ্রিম ধন্যবাদ.
হালনাগাদ
1- আমার package.jsonইতিমধ্যে স্থিতিশীল @angular/router 3.3.1সংস্করণ রয়েছে। 2- আমার মূল appমডিউলে, আমি আমদানি করেছি routing-module। দয়া করে নীচে দেখুন.
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AlertModule } from 'ng2-bootstrap';
import { LayoutModule } from './layout/layout.module';
import { UsersModule } from './users/users.module';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { PageNotFoundComponent } from './shared/components/not-found.component';
@NgModule({
declarations: [
AppComponent,
PageNotFoundComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
AlertModule.forRoot(),
LayoutModule,
UsersModule,
AppRoutingModule --> This is the routing module.
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }অ্যাপ্লিকেশান-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { SigninComponent } from './users/signin/signin.component';
import { PageNotFoundComponent } from './shared/components/not-found.component';
const routes: Routes = [
{ path: '**', component: PageNotFoundComponent }
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule {}রুট আমি অ্যাক্সেস করার চেষ্টা করছি অন্য থেকে অর্পণ করা হয় moduleযেUsersModule
ব্যবহারকারী-routing.module.ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { SigninComponent } from './signin/signin.component';
const usersRoutes: Routes = [
{ path: 'signin', component: SigninComponent }
];
@NgModule({
imports: [
RouterModule.forChild(usersRoutes)
],
exports: [
RouterModule
]
})
export class UsersRoutingModule { }আমি যখন Layoutমডিউলের অংশ, এমন একটি উপাদান থেকে নেভিগেট করার চেষ্টা করছি , তবে রাউটার মডিউলটির কোনও ধারণা নেই। এটাই কি ত্রুটি সৃষ্টি করছে।
Layout.module.ts
import { NgModule } from '@angular/core';
import { HeaderComponent } from './header/header.component';
import { FooterComponent } from './footer/footer.component';
@NgModule({
declarations: [HeaderComponent, FooterComponent],
exports: [HeaderComponent, FooterComponent]
})
export class LayoutModule{}আমি এ থেকে নেভিগেট করার চেষ্টা করছি HeaderComponent। প্রয়োজনে আরও তথ্য সরবরাহ করতে পেরে আমি খুশি হব।
RouterModuleকরতে imports: []যেখানে আপনি ব্যবহার সকল মডিউল এর routerLinkবা<router-outlet>
AppRoutingModuleআগে সরে যানLayoutModule