• angular的路由例子


    app.routing.module.ts里面,关键部分

    const routes: Routes = [
      { path: '', redirectTo : 'c3/c2/mmc', pathMatch: 'full'},
      { path: 'c3', component: C3Component,
        children: [
          { path: 'c2/:name', component: C2Component},
        ]
      },
      { path: '**', component: ErrorComponent}
    ];

    C2Component关键部分

    export class C2Component implements OnInit {
      // tslint:disable-next-line:variable-name
      private _router: ActivatedRoute
    
      constructor(router: ActivatedRoute) {
        this._router = router;
      }
    
      ngOnInit() {
        let name = this._router.snapshot.params["name"];
        let queryId = this._router.snapshot.queryParams["id"];
        console.log(name, queryId);
      }
    }

    c3.component.html里面关键部分

    <h1>c3 page</h1>
    <!--下面这个一定要写,否则会无法渲染子路由组件-->
    <router-outlet></router-outlet>

    测试连接地址

    http://localhost:4200/c3/c2/aaa?id=123234
  • 相关阅读:
    MVC6 发布IIS
    Spring-Spring Bean后置处理器
    Java中重载和重写
    Java基础
    Python高级教程-多重继承
    Spring Bean声明周期
    Spring Bean作用域
    Spring-ApplicationContext容器
    Spring-BeanFactory容器
    Spring-Spring IoC容器
  • 原文地址:https://www.cnblogs.com/ziyouchutuwenwu/p/10978003.html
Copyright © 2020-2023  润新知