美文网首页
Angular 路由的一个问题,以及解决方案

Angular 路由的一个问题,以及解决方案

作者: _扫地僧_ | 来源:发表于2021-09-06 10:44 被阅读0次

问题:点击了 navigate to 之后,浏览器地址栏已经出现了 custom:

但是并没有显示我期望的 DummyComponent 内容,其 onInit 方法根本就没有被调用到:

解决办法:在入口 Component,即 browserTest Component 的模板文件里,增添 router-outlet:

然而带来的副作用是:出现了两份一模一样的 UI:

原因:

解决办法是,创建一个新的 EntryComponent,作为整个应用的入口:

最后 app.component.html 里,放置的是 entry selector:

最后的运行时效果:点 navigate 之前

点击之后:

更多Jerry的原创文章,尽在:"汪子熙":


相关文章

  • 前端路由原理和React Router

    前端路由原理 前端三大框架 Angular、React、Vue ,它们的路由解决方案 angular/router...

  • Angular 路由的一个问题,以及解决方案

    问题:点击了 navigate to 之后,浏览器地址栏已经出现了 custom: 但是并没有显示我期望的 Dum...

  • angular 前端路由不生效解决方案

    angular 前端路由不生效解决方案 Intro 最近使用 Angular 为我的活动室预约项目开发一个前后端分...

  • Angular2.0—路由跳转

    Angular2.0—路由跳转 [# Angular2.0 —构建项目的流程以及使用ng-zorro 友情链接:A...

  • 简介angular路由

    angular路由 北京小课堂 分享人:吴昊杰 目录 1.背景介绍 2.知识剖析 3.常见问题 4.解决方案 5....

  • 模拟面试问题总结

    AngularJS路由实现原理 Angular路由 允许我们通过不同的URL访问不同的内容,并且Angular路由...

  • 模拟面试问题总结

    AngularJS路由实现原理 Angular路由 允许我们通过不同的URL访问不同的内容,并且Angular路由...

  • Angular 4 路由快速入门

    路由是 Angular 应用程序的核心,它加载与所请求路由相关联的组件,以及获取特定路由的相关数据。这允许我们通过...

  • angular路由

    1.背景介绍 angular路由 angular路由可以实现多视图的单页Web应用。当请求一个url时,根据...

  • Angular Route导航

    Angular Route导航 路由基础知识 路由相关对象介绍 新建路由项目 使用angular-cli新建项目。...

网友评论

      本文标题:Angular 路由的一个问题,以及解决方案

      本文链接:https://www.haomeiwen.com/subject/spijmltx.html