开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

在Angular 2中使用ng g类时路径无效

的问题可能是由于以下几个原因导致的：

路径错误：首先要确保你在命令行中正确指定了要生成类的路径。路径应该是相对于项目根目录的，可以使用相对路径或绝对路径。如果路径无效，可以尝试使用绝对路径或检查路径是否正确。
Angular CLI版本问题：Angular CLI是一个用于快速开发Angular应用的命令行工具。不同版本的Angular CLI可能会有不同的命令和参数。确保你使用的是与你的Angular版本兼容的Angular CLI版本。可以通过运行ng --version命令来查看Angular CLI的版本信息。
依赖问题：如果你在使用ng g类时遇到路径无效的问题，可能是由于缺少必要的依赖导致的。请确保你的项目中已经安装了必要的依赖，并且版本与Angular版本兼容。可以通过运行npm install命令来安装缺少的依赖。
Angular项目结构问题：Angular项目通常有一定的目录结构规范，如果你的项目结构与规范不符，可能会导致ng g类命令无效。请确保你的项目结构符合Angular的最佳实践，并且在正确的目录下运行ng g类命令。

总结起来，解决在Angular 2中使用ng g类时路径无效的问题，你可以检查路径是否正确、确保使用与Angular版本兼容的Angular CLI版本、安装必要的依赖、并确保项目结构符合Angular的最佳实践。如果问题仍然存在，可以尝试搜索相关的解决方案或向社区寻求帮助。

关于Angular的更多信息和相关产品，你可以参考腾讯云的Angular文档和Angular相关产品：

Angular文档：https://angular.io/docs
腾讯云Angular产品：https://cloud.tencent.com/product/angular

相关搜索:Angular CLI 8.在tsconfig.json中使用“路径”时“ng serve”失败 angular http请求在使用ng build --prod构建时从不返回数据 Angular ng模型在使用ng true和ng false时需要点击2次 angular-cli: ng g组件在app.module中生成错误的导入路径(反斜杠使用angular ng-class更改uiview时，如何将容器的类更改为container-fluid？使用ng serve时，Angular类中的编译错误使用ng-repeat时在Angular中创建行创建类时，ng g类在angular 9上不起作用在Angular 2中使用ng-table时如何输入复选框？在angular中使用<ng- PortalHost >包装时未检测到内容

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Angular CLI 常用终端操作命令

my-new-service 类| ng g class my-new-class 接口| ng g interface my-new-interface...关于CLI生成路由 ---- CLI以多种方式支持路由：初始化创建项目时，自动添加了 @angular/router ，自动添加到package.json 文件中生成模块路由的时候可以使用指令...您可以在创建或初始化项目时使用该--routing选项ng new来创建app-routing.module.ts文件。...--environment=dev--environment=prod 可以在 angular-cli.json 该文件中配置映射编译环境路径 //angular-cli.json...ng g directive my-new-directive 管道| ng g pipe my-new-pipe 服务| ng g service my-new-service 类| ng

2.1K4 0

Angular 从入坑到挖坑 - 表单控件概览

之后，NgModel 指令通过更新控件的 css 类，达到反映控件状态的目的状态发生时的 css 类没发生的 css 类控件被访问 ng-touched ng-untouched 控件的值发生变化...通过这些控件的 css 类样式，就可以通过添加自定义的 css 样式在用户输入内容不满足条件时进行提示 .ng-valid[required], .ng-valid.required { border-left...在数据验证失败的情况下，对于系统来说，表单是不允许提交的，因此可以将提交事件绑定到表单的 ngSubmit 事件属性上，通过模板引用变量的形式，在提交按钮处进行数据有效性判断，当无效时，禁用表单的提交按钮...，在设定规则时，需要将模板中控件名对应的数据值的第二个参数改为验证的规则在响应式表单中，数据源来源于组件类，因此应该在组件类中直接把验证器函数添加到对应的 FormControl 的构造函数上。...在模板驱动表单中，因为不是直接使用的 FormControl 实例，因此这里应该在模板上添加一个自定义的指令来完成对于控件数据的校验使用 angular cli 创建一个用来进行表单验证的指令 ng

18.9K2 0

Angular CLI 使用教程指南参考

Angular CLI 使用教程指南参考 Angular CLI 现在虽然可以正常使用但仍然处于测试阶段. Angular CLI 依赖 Node 4 和 NPM 3 或更高版本....npm install -g angular-cli 在 Mac 或 Linux 平台上，你可能需要添加sudo前缀提权进行全局安装： sudo npm install -g angular-cli...输出详细信息 --skip-npm 在项目第一次创建时不执行任何npm命令 --name 指定创建项目的名称 ng serve ng new PROJECT_NAME cd PROJECT_NAME...--verbose -v 输出详细信息 --skip-npm 在项目第一次创建时不执行任何npm命令 --name 指定创建项目的名称 ng completion 命令描述 ng completion...将自动完成功能添加到ng命令的shell中 ng doc 命令描述 ng doc 在浏览器中打开Angular文档并搜索当前关键字 ng e2e 命令描述 ng e2e 使用

3K5 0

Angular 6.x 表单快速入门

阅读须知本教程的开发环境及开发语言： Angular 6.x Angular CLI TypeScript 基础知识 Angular CLI 基本使用安装 Angular CLI (可选) $ npm...install -g @angular/cli 创建新的项目 $ ng new project-name 启动本地服务器 $ cd project-name $ ng serve Angular 表单简介...Driven 表单的特点使用方便适用于简单的场景通过 [(ngModel)] 实现数据双向绑定自动生成 Form Model (异步) 最小化组件类的代码不易于单元测试 Reactive 表单的特点...在 Angular 中，我们可以使用熟悉的标签来创建表单。...在 Angular 表单中，若验证通过则会在表单控件上添加 ng-valid 类，若验证失败则会在表单控件上添加 ng-invalid 类。

4.6K2 0

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

危机中心页面 ng g component crisis-list -- 英雄中心页面 ng g component hero-list -- 英雄相亲页面 ng g component hero-detail...-- 404 页面 ng g component page-not-found 在 app-routing.module.ts 文件中完成对于项目路由的定义，这里包含了对于路由的重定向、通配路由，...，可以通过 Angular CLI 来生成路由守卫的接口实现类，通过命令行，在 app/auth 路径下生成一个授权守卫类，CLI 会提示我们选择继承的路由守卫接口，这里选择 CanActivate 即可...ng g guard auth/auth ?...Angular CLI 创建一个危机中心模块（crisis 模块） -- 查看创建模块的相关参数 ng g module --help -- 创建危机中心模块（自动在 app.moudule.ts

3.7K3 0

Angular基础-搭建Angular运行环境

这篇文章介绍了在Angular项目中进行开发环境搭建的关键步骤。包括node.js安装和配置、安装Angular CLI工具、安装angular-router、创建Angular项目等步骤。...我们需要设置全局安装包的目录路径、设置 npm 包的缓存路径安装目录下新建 “node_global”和 “node_cache” 文件夹创建完毕后，使用管理员身份打开cmd命令窗口，输入： npm...一旦安装完成，您可以使用 ng new 命令来创建新的 Angular 项目，并且可以通过 Angular CLI 提供的各种命令和配置来进行项目开发和管理。...简单来说，就是安装Angular CLI工具时包含Angular的安装，不需要单独安装Angular。...命令行输入 npm i -g @angular/cli@15 三、创建Angular项目安装完成后我们新建一个项目，这里我的项目叫 empower-cloud-assistant，输入命令： ng new

1012 1

Angular CLI 简介

最下面是devDependencies, 里面都是开发时用的工具库, 可以看到angular cli就在里面....综上, ng new 的这些参数可以在生成项目的时候作为命令的参数联合使用, 其中有一些参数也可以在项目生成以后通过修改angular-cli.json文件来做修改....: ng g c admin ng g c admin/email -m admin ng g c admin/user -m admin 实际上后两个命令的-m参数可以去掉, 因为已经指定了路径 admin...生成Gurad. ng g guard xxx 这个命令将会生成xxx.guard.ts 使用Angular CLI进行Build (构建) 和 Serve 第一篇文章是: "使用angular cli...和第三方库可以使用source-map-explorer来分析依赖, 并且查看哪些模块和类在bundle里面.

6K11 0

2-进军 angular1.x 表达式和指令

2-表达式和指令，数据绑定 angular1.x 学习目录 1-angular 学习导航和基础 2-表达式和指令，数据绑定 3-模型和作用域 scope 4-控制器和过滤器一表达式 ng-init...对普通元素无效； ng-bind用于普通元素，不能用于表单元素，应用程序单向地渲染数据到元素；当ng-bind和{{}}同时使用时，ng-bind绑定的值覆盖该元素的内容。...数据绑定在输入框中尝试输入：p> 姓名：<input type="text"...使用驼峰法来命名一个指令， runoobDirective, 但在使用它时需要以 - 分割, runoob-directive: <runoob-directive...上有多个指令优先级高的先执行 replace: flase // 默认值为false 当为true是直接替换指令所在的标签 terminal: true //值为true时优先级低于此指令的其它指令无效

2.4K2 0

Angular学习（02）--Angular-CLI命令

ng g component ng g component xxx 是用来创建组件的，直接使用该命令，会默认在当前目录下创建一个 xxx 文件夹，并在内部创建以下几个文件： xxx.component.css...以上，是使用 ng g component 命令时，可以携带的一些选项配置，来修改默认的行为，其中，如果选项配置为 true，那么 value 值可以省略，如 --flat=true 可以简写成 --flat...ng g directive 这个是创建指令的命令，组件其实是指令的一种，所以，上面介绍的关于组件命令中的各种选项配置，在指令这里也基本都可以使用，这里不列举了，清楚相关默认文件来源后，不懂的，去翻阅下就可以了...ng g service 这个是创建服务类的命令，支持的选项配置参考上面几种命令。默认生成的有两份文件，ts 和测试文件。...ng g class/interface/enum 创建实体类，接口，或枚举的命令，因为这些类型的文件，默认需要的代码模板并不多，即使不用命令创建，手动创建也行。

2.6K1 0

【Angular教程】-组件初识｜8月更文挑战

前提: 准备一个空的angular项目(ng new angular-course) 与Angular组件的第一次会面 **通过创建组件命令: ****ng g c components/HelloWorld...**** 组件核心类来看一下内容, 除了常规的导入模块和创建了一个****HelloWorldComponent**类之外,还使用了**@Component**装饰器。...selector: 标注组件的名称,在使用组件的时候使用的就是它 templateUrl: 标注html模板的路径 styleUrls: 标注html模板使用的样式的路径,我们看到是用的数组格式,说明传递多个样式文件应该是没有问题的...组件相关的其他文件暂时先放一放,在Vue开发的时候我们创建好的组件总是要挂载后才能使用的,那angular需要挂载吗?...: 属性绑定+事件绑定, 所以双向绑定的语法就是 [(attribute)]="variable" 我们准备一个演示双向绑定的组件: ng g c components/sizer 组件中我们需要通过

1.9K2 0

Angular CLI命令

ng 基础命令 npm install –g @angular/cli npm install -g @angular/cli@latest ng serve –prot –aot 启动项目并压缩项目文件...端口被占用错误，请使用 ng serve --port 4211 //4211为替换默认4200的端口出现以下消息表示运行成功： ?...最基本的组件分为两部分： Component注解组件定义类组件代码讲解： import { Component, OnInit } from '@angular/core'; // 1.import.../hello-world.component.css'] }) //1.我们可以把注解看做是添加到代码上的元数据.挡在hellowerld类上使用@Component时，就把helloworld“装饰...标签表示我们希望在html中使用该组件.要实现它，就得配置@Component并把selector指定为<app-hello-world 加载组件 ?

9082 0

浅谈Angular

创建项目: 要想使用 npm 来安装 CLI，请打开终端/控制台窗口，并输入下列命令： npm install -g @angular/cli ②创建工作区和初始应用:ng new 文件名 ③启动开发服务器...里,默认的数据绑定是单向的,即Model向View 如果要实现双向绑定,需要使用到ngModel指令语法: [(ngModel)]='值' ***直接写指令,在angularJS里会报错...来控制元素的显隐在自定义指令里获取指令添加到其上面的元素,需要依赖注入ElementRef服务如果自定义指令想要接收从外部传入的值,需要使用@Input装饰器\....里路径传值: <!...里,并不是所有的值都可以被订阅,只有Observable类或者Observable的子类创建出的对象可以被订阅 subscribe是Observable类下的一个函数。

4.4K1 0

为应用生成路由.

第一篇文章是: "使用angular cli生成angular5项目" : http://www.cnblogs.com/cgzl/p/8594571.html 第二篇文章是: "使用angular cli...从蓝本生成代码" : http://www.cnblogs.com/cgzl/p/8605464.html 我们知道使用 ng g module admin 将会生成admin module....下面再生成两个components: ng g c dashboard ng g c order 然后在app-routing.module里面设置路由: 再修改一下html: 运行一下应用: ng...再生成一个module, 并且带着路由module (可以先使用-d参数查看将要生成的文件): ng g m admin --routing 在admin module里面, 再创建一个admin component...: ng g c admin ng g c admin/email -m admin ng g c admin/user -m admin 实际上后两个命令的-m参数可以去掉, 因为已经指定了路径 admin

2623 0

前端MVC学习总结（一）——MVC概要与angular概要、模板与数据绑定

：方法二与方法一的区别：使用模块标签{{ }}加载慢或渲染慢时用户将看到标签，而ng-bind不会，但是使用模块要方便。...如果表达式结果为一个数组，则数组中每个元素为使用空格分隔的一个或多个类名字符串。如果表达式结果为一个对象，对象中的每个key-value中如果键值为真时则键名作为类名。...这个指令不会添加重复的类，如果这个类已经存在的话。当表达式改变时，以前添加的类会被移除，并且只会添加之后新产生的类。 ngStyle指令允许你在HTML元素上条件化设置CSS样式。...与ng-href 用于指定资源路径。...在src或者href属性上简单使用{{}}绑定时无法很好运行，出现404错误因为图片加载时可能模板还未被替换成真实路径。

15.3K10 0

前端MVC学习总结（一）——MVC概要与angular概要、模板与数据绑定

当加载慢时的效果： ? 方法二与方法一的区别：使用模块标签{{ }}加载慢或渲染慢时用户将看到标签，而ng-bind不会，但是使用模块要方便。...如果表达式结果为一个数组，则数组中每个元素为使用空格分隔的一个或多个类名字符串。如果表达式结果为一个对象，对象中的每个key-value中如果键值为真时则键名作为类名。...这个指令不会添加重复的类，如果这个类已经存在的话。当表达式改变时，以前添加的类会被移除，并且只会添加之后新产生的类。 ngStyle指令允许你在HTML元素上条件化设置CSS样式。... 当条件为true时类样式出现 Sample Text...2.10、ng-src与ng-href 用于指定资源路径。在src或者href属性上简单使用{{}}绑定时无法很好运行，出现404错误因为图片加载时可能模板还未被替换成真实路径。

12.6K3 0

【转载】【ionic+angularjs】angularjs ui-router路由简介

如果你想定制与URL同步的行为（例如，你需要保持当前的URL去并且推迟一个变化），那么在配置的时候使用这个方法。参数： defer：boolean，确定是禁止还是启用该拦截。...= undefined) defer = true; interceptDeferred = defer; // 默认是true }; otherwise(rule); 定义一个当请求的路径是无效路径时跳转的路径...ui-router 1.1导入js文件需要注意的是：必须导入angular.min.js这个文件，且angular.min.js必须导入在angular-ui-router.min.js前面。...通过views实现多视图多个示图时，使用views属性。该属性里包含了哪些ui-view，则对应的template或templateUrl里的内容就会填充该ui-view。...在ngRoute中resolve选项可以允许开发者在路由到达前载入数据保证（promises）。在使用这个选项时比使用angular-route有更大的自由度。

7.4K7 0

Angular 6.x 快速入门

第一节 - Angular 环境搭建基础要求 Node.js Git Angular 开发环境安装 Angular CLI (可选) $ npm install -g @angular/cli 检测...第二节 - 插值表达式在 Angular 中，我们可以使用插值语法实现数据绑定。...基础知识定义组件的元信息在 Angular 中，我们可以使用 Component 装饰器来定义组件的元信息： @Component({ selector: 'my-app', // 用于定义组件在...name = 'Angular'; } 定义数据接口在 TypeScript 中的接口是一个非常灵活的概念，除了可用于对类的一部分行为进行抽象外，也可用于对「对象的形状（Shape）」进行描述...router-outlet 指令该指令用于告诉 Angular 在哪里加载组件，当 Angular 路由匹配到响应路径，并成功找到需要加载的组件时，它将动态创建对应的组件，并将其作为兄弟元素，插入到

14.1K2 0

【Hybrid开发高级系列】AngularJS(二)——常用$服务

用rootscope定义的值，可以在各个controller中使用。...$apply()方法可以在angular框架之外执行angular JS的表达式，例如：DOM事件、setTimeout、XHR或其他第三方的库。...hash( )：读、写；当带有参数时，返回哈希碎片；当在带有参数的情况下，改变哈希碎片时，返回$location。 host( )：只读；返回url中的主机路径。 ...path( )：读、写；当没有任何参数时，返回当前url的路径；当带有参数时，改变路径，并返回$location。...angule js中ng-view中使用了ng-include，如何实现ng-include的这个页面刷新，外部的ng-view不刷新 http://www.oschina.net/question/2356458

3724 0

Ng-Matero V9 正式发布！

Angular V9 已经在二月份重磅发布，拖沓了一个月，Ng-Matero V9 也终于发布！其中大部分时间耗在了 Material Extensions 的组件开发上。...Bootstrap 的表单元素相对比较独立，任何第三方表单类组件都可以直接使用。...但是在 Angular Material 中就不能如此自由随意，比如在 Angular Material 的表单中使用 ng-select。...虽然 ng-select 有 Material 的主题，但是直接使用的话，你会发现没办法展示错误信息。所有第三方表单组件都必须继承 form-field 类才能获得最佳交互体验。...这套组件库的组件大致有以下三类：完全独立开发的组件（e.g. alert） Angular Material 组件的二次封装（e.g. data-grid）第三方组件的优化及包装（e.g. color-picker

1.3K2 0

Angular 从入坑到挖坑 - Angular 使用入门

全局安装 Angular CLI ## 在电脑上以全局安装的方式安装 angular cli npm install -g @angular/cli ?...验证是否安装成功 ## 查看 angular cli 版本 ng v ## 查看 angular cli 中的各种命令解释 ng help ?...解释 --force 强制覆盖现有文件 --skipInstall 创建项目时跳过 npm install 命令 --strict 在代码中使用更严格的 typescript 编译选项 ?...node.js 的 javascript 测试执行过程管理工具 package-lock.json - 针对当前工作空间使用到 npm 包，安装到 node_modules 时的版本信息...↩ 2 现代浏览器支持的某些原生 API，当用户使用老版本的浏览器或某些浏览器时并不支持，只要使用了 polyfills 这个库，即可对于这些无法使用的浏览器添加支持，使用方法也无需更改（PS：针对的是原生的

1.9K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭