Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >angular2中在使用路由懒加载时候出现的错误

angular2中在使用路由懒加载时候出现的错误

杭州前端工程师

发布于 2018-06-15 04:18:07

发布于 2018-06-15 04:18:07

5.5K00

代码可运行

举报

文章被收录于专栏：前端大白专栏前端大白专栏

运行总次数：0

代码可运行

ERROR in Cannot use 'in' operator to search for 'providers' in null 出现这个问题的原因是，在使用懒加载的时候，没有指定module，没有找到相关的提供信息。

const routes: Routes = [
 {path:'login',component:loginComponent},
  { path: 'about', loadChildren: './home/home/home.module'},]

以上是修改之前报错的代码：

以下是修改之后不报错的代码，只需要给其指定一module:

const routes: Routes = [
 {path:'login',component:loginComponent},
  { path: 'about', loadChildren: './home/home/home.module#AboutModule'},]

这样即可！

本人由于还是在学习阶段，欢迎讨论！

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

【前端芝士树】Vue - 路由懒加载 - 实践所遇问题摘记

vue.js webpack babel.js javascript node.js

首先，可以将异步组件定义为返回一个 Promise 的工厂函数 (该函数返回的 Promise 应该 resolve 组件本身)：

CloudCat

2022/05/06

3440

angular2路由预加载

1. 实现PreloadingStrategy 类 import { PreloadingStrategy, Route } from "@angular/router"; import { Observable } from "rxjs"; /** * 预加载策略 */ export class SelectivePreloadingStrategy implements PreloadingStrategy { preload(route: Route, load: Function): O

用户1437675

2018/08/20

1K0

Angular 2 + 折腾记：(4)初步了解路由及使用

路由就是控制视图与视图之间的跳转，之间还可以传递参数什么的,路由的退后及前进不会完整的请求整个页面，还可以完全不请求(在生命周期里面控制);

CRPER

2018/08/28

3.1K0

Angular 路由配置（预加载配置，懒加载配置）

typescript 编程算法 angularjs html

（1）RouterModule对象提供了两个静态的方法:forRoot()和forChild()来配置路由信息。

玖柒的小窝

2021/11/04

3.3K0

angular 路由懒加载_angular路由

https 网络安全 angularjs

在angular中路由即能加载组件又能加载模块，而我们说的懒加载实际上就是加载模块，目前还没有看到懒加载组件的例子。加载组件使用的是component关键字加载模块则是使用loadChildren关键字

全栈程序员站长

2022/11/08

1.4K0

基于webpack4+react 的js懒加载

react webpack javascript 打包 node.js

此处主要介绍使用动态导入（通过模块中的内联函数调用来分离代码）的懒加载。这种动态代码拆分的方式是webpack提供并推荐选择的方式。其原理是使用符合 ECMAScript 提案的 import() 语法来实现动态导入。

shirley

2019/03/24

4.4K0

🔥【Angular教程】路由入门

路由的概念在前端的框架中得到了广泛的应用,对于路由的感念不做阐述,路由的应用无外乎就是嵌套、传参，高级一些的功能如懒加载、预加载，再高级一些的如：路由守卫等。本篇我们就一起来看一看在Angular中如何使用路由。

前端小鑫同学

2022/12/25

4.5K0

🔥【Angular教程】路由入门

模块化开发 Angular 应用 [含懒加载]

编程算法 javascript angularjs http

然后，我们将学习怎么使用我们的模块来启用延迟加载，从而使应用更小，使用户体验更好。

Jimmy_is_jimmy

2022/09/19

3.1K0

模块化开发 Angular 应用 [含懒加载]

什么是路由懒加载_react 路由懒加载

https 网络安全

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

全栈程序员站长

2022/11/08

1K0

angular2 路由问题

Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'main' 这个问题的处理很简单,是路由的路径写错了, import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import {loginComponent} from './login/login.component'; impor

杭州前端工程师

2018/06/15

1.2K0

angular4实战（2） router

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/j_bleach/article/details/78077844

j_bleach

2019/07/02

5930

angular4实战（2） router

vue路由的懒加载

下面是路由懒加载写法。和非懒加载写法。 # router/index.js import Vue from ‘vue’ import VueRouter from ‘vue-router’ import User from ‘../components/User’ Vue.use(VueRouter) const routes = [ { // 这种写法就是路由的懒加载了，只有当点击跳转这个路由的时候才会向服务器请求js资源，因为 // 打包的时不写懒加载的话，vue会把所有的js都打包到一个js文

kirin

2020/05/31

7020

vue（18）路由懒加载「建议收藏」

打包 https java 网络安全编程算法

我们看到从一开始我们就导入了路由对应的组件，如果需要的导入的组件非常多，那么加载页面就会相对较慢，我们来看下这种方式打包出来的文件

全栈程序员站长

2022/09/19

3550

vue（18）路由懒加载「建议收藏」

Angular 工具篇之国际化处理

javascript typescript json npm angularjs

在日常开发过程中，某些项目会要求支持国际化。对于使用 Angular 框架的项目来说，我们可以利用以下第三方库，快速支持国际化：

阿宝哥

2019/11/05

2.1K0

angular使用NG ZORRO来构建博客展示项目(项目结构及路由)

创建项目使用angular脚手架搭建项目。如何使用angular脚手架搭建项目参看这篇文章 ng new blog-angular 安装NG ZORRO 我们界面UI选用NG ZORRO。可以参考官网，https://ng.ant.design/#/docs/angular/getting-started cd blog-angular npm install ng-zorro-antd --save 在根 module 中需要使用 NgZorroAntdModule.forRoo

易兒善

2018/08/21

1.3K0

angular使用NG ZORRO来构建博客展示项目(项目结构及路由)

Angular4中路由Router类中navigate跳转用法

https 网络安全

之前通过学习 angular4 框架的开发，它确实比以前有了很大的变化和改进，好多地方也不是那么容易就能理解，好在官方的文档和例子是中文，示例相对简单，对英文不太好的伙伴们学习还是有很大帮助。

玖柒的小窝

2021/10/24

7190

vue-router实现路由懒加载( 动态加载路由 )_前端懒加载原理

webpack javascript vue.js 打包

　　　　像vue这种单页面应用，如果没有应用懒加载，运用webpack打包后的文件将会异常的大，造成进入首页时，需要加载的内容过多，时间过长，会出啊先长时间的白屏，即使做了loading也是不利于用户体验，而运用懒加载则可以将页面进行划分，需要的时候加载页面，可以有效的分担首页所承担的加载压力，减少首页加载用时

全栈程序员站长

2022/11/10

1.7K0

vue-router实现路由懒加载( 动态加载路由 )_前端懒加载原理

Angular学习(01)-架构概览

官方的教程，其实已经很详细且易懂，这里再次梳理的目的在于复习和巩固相关知识点，刚开始接触学习 Angular 的还是建议以官网为主。

请叫我大苏

2019/03/19

3.8K0

Angular学习(01)-架构概览

Angular 从入坑到挖坑 - 路由守卫连连看

angularjs 编程算法 typescript

Angular 入坑记录的笔记第六篇，介绍 Angular 路由模块中关于路由守卫的相关知识点，了解常用到的路由守卫接口，知道如何通过实现路由守卫接口来实现特定的功能需求，以及实现对于特性模块的惰性加载

程序员宇说

2020/06/04

3.9K0

vue路由懒加载及组件懒加载

方法如下：component：resolve=>(require(['需要加载的路由的地址'])，resolve)

前端小tips

2021/11/25

1.7K0

相关推荐

【前端芝士树】Vue - 路由懒加载 - 实践所遇问题摘记

更多 >

杭州前端工程师0

LV.1

阿里前端工程师

作者相关精选

换一批

加入讨论

的问答专区 >

1高级后端开发工程师擅长3个领域

相关课程

一站式学习中心 >

轻量应用构建训练营

轻量应用服务器

AI代码助手快速上手训练营

腾讯云代码助手

AI绘画-StableDiffusion图像生成

大模型图像创作引擎

高性能应用服务

本文部分代码块支持一键运行，欢迎体验

本文部分代码块支持一键运行，欢迎体验