angular创建没有app.module.ts/app-routing.module.ts文件解决办法

sl200000

已于 2024-06-14 11:42:34 修改

阅读量696

点赞数 10

文章标签： angular.js 前端 typescript

于 2024-06-14 11:40:19 首次发布

本文链接：https://blog.csdn.net/sl200000/article/details/139677722

版权

//安装脚手架

npm install -g angular-cli

//创建项目

ng new project_name(项目名称)

//启动项目

cd project_name

ng serve --open

通过以上代码创建是新版没有app.module.ts/app-routing.module.ts文件

如果你想要继续使用模块化的方式构建你的Angular应用，可以通过运行

ng new project_name(项目名称) 替换为 ng new my-app --no-standalone --routing --ssr=false

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

sl200000

关注关注

10
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
angular创建没有app.module.ts/app-routing.module.ts文件解决办法

如果你想要继续使用模块化的方式构建你的Angular应用，可以通过运行。
复制链接

扫一扫

Ionic4—根路由app-routing.module详解

雷雨天的雷胖子

11-14

1884

目录一、概述二、配置文件结构三、结构详解一、概述 app-routing.module.ts是Ionic4的根路由配置文件。二、配置文件结构 import { NgModule } from '@angular/core'; import { PreloadAllModules, RouterModule, Routes } from '@angular/router';...

路由的模块写法

lee727n的博客

04-27

622

首先参考上篇文章 angular 路由基础_MIKE-zi的博客-CSDN博客1.首先根节点 app-routing.module.tsconst routes = [{ path: 'home', component: HomeContainerComponent}]@NgModule({ /** * 根路由使用 `RouterModule.forRoot(routes)` 形式。 * 而功能模块中的路由模块使用 `outerModule.forChild(routes)` 形式。 * 启用路由的 de

参与评论您还未登录，请先登录后发表或查看评论

使用AngularRoute导航

weixin_44174685的博客

12-21

327

AngularRoute导航

Angular项目app下缺少 app.module.ts

jiangnianwangluo的博客

03-14

1683

现在，使用Angular CLI创建新项目时，默认生成的是独立应用，这意味着不再自动创建`app.module.ts`文件，除非明确使用`--no-standalone`选项。这是一个重要的变化，因为`app.module.ts`是Angular项目中的核心文件，用于定义根模块，告诉Angular如何组装应用。命令来创建一个新的项目，这将会生成包含 app.module.ts和app-routing.module.ts的项目结构。是Angular CLI的命令，用于创建一个全新的Angular应用。

qq_41747548的博客

03-30

471

angular新版本未生成app.module.ts

hb_zxl的专栏

12-05

3116

查看目录，未生成app.module.ts。

Angular 中的app.module.ts

一个搬砖工人

11-03

497

【代码】Angular 中的app.module.ts。

Angular 学习笔记 —— 路由、模块、Ant Design

Lyrelion的博客

10-09

802

1.路由 1.1 app-routing.module.ts 配置路由 // 引入组件 import { HomeComponent } from './home/home.component'; import { NewsComponent } from './news/news.component'; import { NewscontentComponent } from './newscontent/newscontent.component'; // 配置路由（路径对应的组件） cons.

Angular(三) - 路由模块

06-04

1379

在原始的路由配置中，你提供了仅有两个路由的简单配置来设置应用的路由。如下图对于简单的路由，这没有问题。随着应用的成长，你用到了更多路由器特性，比如守卫、解析器和子路由等，你会很自然地想要重构路由。我们建议将路由信息移到一个单独的特殊用途的模块，叫做路由模块路由模块有什么优点？开发者可以很自然的从路由模块中查找和扩展路由配置当设计复杂的守卫，解析等就会变得...

Angular 5 路由小结

xnyssxy的博客

03-27

8136

首先要添加路由模块，通常定义为 AppRoutingModule，通过CLI指令生成：ng generate module app-routing --flat --module=app--flat 把这个文件放进了 src/app 中，而不是单独的目录中。--module=app 告诉 CLI 把它注册到 AppModule 的 imports 数组中。生成后的代码：import { NgMod...

angular2.0定义单独的路由模块

沈斯明技术博客

12-15

3048

在/app目录新建一个文件，名叫app-routing.module.ts。路由模块将导入RouterModule令牌，并配置路由。我们遵循文件名约定，并命名Angular模块为AppRoutingModule。和app.module.ts中一样，导入CrisisListComponent和HeroListComponent组件。然后在路由模块中导入Router和路由配置（Ro

Angular4学习笔记（三）：router

热门推荐

龙骑将的城堡

04-17

2万+

router：一条大路呦，通呀通我家

AngularJS 事件

07-22

394

在 AngularJS 中，事件是视图（HTML）与控制器（JavaScript）之间通信的桥梁。通过事件，用户与页面的交互可以被控制器捕获并相应地处理。AngularJS 使用自定义的 HTML 属性来绑定事件，这些属性以ng-开头，例如ng-clickng-change等。除了内置的事件，AngularJS 还允许我们创建自定义事件。这可以通过$scope对象的$emit$broadcast方法来实现。自定义事件常用于跨控制器或组件之间的通信。

ASP.NET Core Web API 使用Autofac框架

鲤籽鲲的博客

08-08

498

ASP.NET Core Web API 使用Autofac框架

Vue3 Suspense 和 defineAsyncComponent 结合使用方法

qq_30193097的博客

08-13

104

定义一个异步组件，它在运行时是懒加载的。参数可以是一个异步加载函数，或是对加载行为进行更具体定制的一个选项对象。用于协调对组件树中嵌套的异步依赖的处理。上述案例可以实现大型项目的骨架屏效果。

略记一次抓取内容后解密及登录的经历

深蓝浅蓝的天

08-09

1028

从我这个不专业的爬虫工程师来看，爬虫工作是比较看耐心的，尤其是登录和其他的破解环节，一定要相信，从理论上来破的东西，它确实就能破，但确实太考验耐心了。最后再拿下登录返回的token，准备一台手机，自动接收验证码，然后启一个接受短信的服务存到redis，至此登录、请求接口、解密数据全部完成。，key是接口有返回的，但iv对方网站就隐藏的很好，除了这个iv，其他的问题都解决了，加密字符串也成功解密。尤其是解密的代码，调用栈太长了，我水平不够，整整看了2天，才从这种代码中找出了它主要的解密方式，

前端JS总结（中）

m0_54066656的博客

08-12

610

前端JS之内置对象总结，这很重要！！！

el-checkbox 状态不更新

最新发布

bao

08-13

185

（不添加响应式大概是因为：原数据是从 vue 的data中过滤出来的，filter方法并不会生成一个新的数组。，并不会对这段数据添加响应式处理，所以修改数据时，修改的还是原数据。，还是要学会自己找到问题原因，通过优化代码逻辑来解决问题。数据来源 / 浅拷贝都会导致这个问题。否则数组中对象还是指向原数据。从现有数据中过滤出新的数据，并且添加。由于数据结构是数组对象格式，这里。以上代码中处理数据后直接赋值到。解决，但频繁使用会影响性能。虽然很多此类情况都能使用。

Angular. 登录页面

03-29

以下是一个简单的Angular登录页面示例： 1. 创建组件创建一个名为“login”的组件： ``` ng generate component login ``` 2. 编辑组件在login.component.html中添加以下代码： ``` <div class="container"> <h2>登录</h2> <form (ngSubmit)="onSubmit()"> <div class="form-group"> <label for="username">用户名：</label> <input type="text" class="form-control" id="username" [(ngModel)]="username" name="username" required> </div> <div class="form-group"> <label for="password">密码：</label> <input type="password" class="form-control" id="password" [(ngModel)]="password" name="password" required> </div> <button type="submit" class="btn btn-primary">登录</button> </form> </div> ``` 在login.component.ts中添加以下代码： ``` import { Component } from '@angular/core'; @Component({ selector: 'app-login', templateUrl: './login.component.html', styleUrls: ['./login.component.css'] }) export class LoginComponent { username: string; password: string; onSubmit() { // 在这里处理登录逻辑 } } ``` 3. 添加路由在app-routing.module.ts中添加登录路由： ``` import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { LoginComponent } from './login/login.component'; const routes: Routes = [ { path: '', redirectTo: '/login', pathMatch: 'full' }, { path: 'login', component: LoginComponent }, ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule] }) export class AppRoutingModule { } ``` 4. 添加导航在app.component.html中添加导航： ``` <nav class="navbar navbar-expand-lg navbar-light bg-light"> <a class="navbar-brand" href="#">Angular App</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link" routerLink="/login">登录</a> </li> </ul> </div> </nav> ``` 现在你已经有了一个简单的Angular登录页面，可以在onSubmit()方法中添加登录逻辑，例如向API发送POST请求以验证用户凭据。