zoukankan      html  css  js  c++  java
  • angular6 路由配置备忘录

      一、创建路由文件

      1、分两种情况,一种是有module文件,没有routing文件。单独创建routing文件即可。以创建app模块路由为例:ng generate module app-routing --flat --module=app

    注意:1、该命令需要在app目录下执行。2、--flat表示不生成文件夹,而是生成平级文件。--module==app表示将改文件注入到app.module.ts中的import中,不用手动引用。3、这个方法不好用,因为他的原理是生成常规module文件,在此基础上修改为routing文件。执行命令得到以下代码

      文件处理:删除不用的部分代码,添加路由文件要用的代码。处理后:以下代码可以作为模板复制

    import { NgModule } from '@angular/core';
    import { RouterModule, Routes } from '@angular/router';
    
    import { AppComponent } from './app.component';
    
    const routes:Routes = [
      {path:'',redirectTo:'index',pathMatch:'full'},
      { path: 'index', component: AppComponent}
    ]
    @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [ RouterModule ]
    })
    export class AppRoutingModule { }

      注意:app顶级路由的时候才用RouterModule.forRoot(),其他路由都要用RouterModule.forChild()。

      添加路由出口:

      2、创建路由的第二种方式(推荐)。在创建一个新的特性模块之前就要规划好是否需要路由,如果要,则在创建模块的时候直接把路由一起创建,这种方式的路由文件是标准的,不需要手动修改。例如app/pages 模块。ng generate module pages --routing --module=app 。

      注意事项:如果你对某个模块使用了路由懒加载的方式加载,那就一定不要再在module.ts文件中import导入该子模块,不然你的懒加载就是没有意义的,加载本模块时就会import子模块。而且还会造成路由配置出现无效的问题!!!切记切记!

  • 相关阅读:
    FineReport---数据集
    FineReport----单元格元素(数据列、公式、斜线)
    FineReport---样式
    SQL-修改: 将日期修改为空NULL、修改为空的记录
    sql---字段类型转换,保留小数位数,取日期格式,sql获取当前时间,时间处理
    深入浅出Mqtt协议
    一文了解Redis
    RDBMS关系型数据库与HBase的对比
    Greedysky:C++ 建议用 nullptr 而不是 NULL
    Greedysky:C++11 新特性之强制类型转换static_cast
  • 原文地址:https://www.cnblogs.com/gouzei/p/10973793.html
Copyright © 2011-2022 走看看