Angluar SPA应用程序的实施路线

问题描述 投票:0回答:1

我想实现我的routing配置,并确保基本的SPA App中的Angular方面!但是问题是没有创建我的components,我的目的是在不创建某些特定routing的情况下通过我的SideNav中的链接实现components!因此,我保证了routing的安全,但是navigation从链接到链接的链接并没有嵌入SPA内容;因此SPA方面不可用!

app-routing.module.ts

import { NgModule } from '@angular/core';


@NgModule({        // routes has the route configuration. 
    // It is a variable of type Routes
      imports: [RouterModule.forRoot(routes)],  /* there is some error here  routes isnt defined ,I knew 
                                                   I have sould have implemented paths and components 
                                                   but like i clarifed above there is a component 
                                                   parameter for forRoot() method  . In my case I had no 
                                                   compenets I have only links */
      exports: [RouterModule]
    })

    export class AppRoutingModule { 
    }

main-nav.component.html

  <mat-sidenav 
  #drawer class="sidenav" fixedInViewport="true"
      [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
      [mode]="(isHandset$ | async) ? 'over' : 'side'"
      [opened]="!(isHandset$ | async)">
    <mat-toolbar>Menu</mat-toolbar>
    <mat-nav-list>
      <a mat-list-item href="City1">City 1</a>  <!-- link1 whom I want to apply SPA aspect -->
      <a mat-list-item href="City2">City 2</a>  <!-- link2 whom I want to apply SPA aspect -->
      <a mat-list-item href="City3">City 3</a>  <!-- link3 whom I want to apply SPA aspect -->
    </mat-nav-list>
  </mat-sidenav>
  <mat-sidenav-content>
    <mat-toolbar color="primary">
      <button
        type="button"
        aria-label="Toggle sidenav"
        mat-icon-button
        (click)="drawer.toggle()"
        *ngIf="isHandset$ | async">
        <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
      </button>
      <span>City-routing</span>
    </mat-toolbar>
    <!-- Add Content Here -->
  </mat-sidenav-content>
</mat-sidenav-container>

html angular angular-router
1个回答
0
投票

如果不使用路由,只需传递一个空数组,例如波纹管:

RouterModule.forRoot([]);
© www.soinside.com 2019 - 2024. All rights reserved.