Angular4.x 安装|创建项目|目录结构|创建组件

Angular4.x 安装|创建项目|目录结构|创建组件


安装最新版本的 nodejs

node.js 官网:https://nodejs.org/zh-cn/

  

去官网下载 node.js,下一步下一步就可以了。只要 node.js 安装成功,那么 npm 也会帮你安装完成!

注意:请先在终端/控制台窗口中运行命令 node -v 和 npm -v, 来验证一下你正在运行 node 6.9.x 和 npm 3.x.x 以上的版本。 更老的版本可能会出现错误,更新的版本则没问题。

   

全局安装 Angular CLI 手脚架工具(只需安装一次)

使用 npm 命令安装

npm install -g @angular/cli

  

  如果安装失败,接着往下看!!!

安装 cnpm

 npm 可能安装失败,建议使用 npm 安装一下 cnpm 用淘宝镜像安装。https://npm.taobao.org/

npm install -g cnpm --registry=https://registry.npm.taobao.org

 使用 cnpm 命令安装

cnpm install -g @angular/cli

创建项目

打开 cmd 找到创建项目的目录

 

假如在桌面的 AngularStudy 目录下创建一个项目,先进入到目录下。

  

创建项目

ng new 项目名称  创建一个项目

ng new my-app

  

进入刚才创建的项目里面,启动服务。

cd my-app

  

npm install //安装依赖

  

ng serve --open

  

一系列操作完成之后,他会帮助我们把新创建的项目在浏览器中运行起来!

    

注意: 如果在运行 npm install 之后报错,删除项目文件夹中的整个 node_modules文件夹,然后重新运行 npm install 命令重新安装依赖,如果再不行,用 cnpm 命令安装。

导入编辑器

 我喜欢 VScode 所以导入里面很容易。

文件 -> 打开文件件 -> 选择项目文件夹,确定!

     

Angular目录结构

表 * 的注意!其他的了解就好。

Hello Angular 4.0 以及 app.module.ts、组件分析

 定义 AppModule,这个根模块会告诉 Angular 如何组装该应用。 目前,它只声明了 AppComponent。 稍后它还会声明更多组件。

   

  

自定义组件

https://github.com/angular/angular-cli

ng g component components/header

   

组件内容详解:

  

 

转载于:https://www.cnblogs.com/wjw1014/p/10345651.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/569810.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第五届省赛(软件类)真题----Java大学B组答案及解析

第五届省赛(软件类)真题—-Java大学B组答案及解析 正则切分调和级数n的n次幂七对数字勾股定理九阶数独G将军 一、正则切分 java中提供了对正则表达式的支持。 有的时候,恰当地使用正则,可以让我们的工作事半功倍! …

第五届省赛(软件类)真题----Java大学A组答案及解析

第五届省赛(软件类)真题—-Java大学A组答案及解析 子序列最大长度莱布尼茨公式n的n次幂七对数字勾股定理九阶数独矩阵射线 一、子序列最大长度 一个串的子串是指该串的一个连续的局部。如果不要求连续,则可称为它的子序列。 比如对串&…

js获取一个月的天数

在使用其他语言获取每月天数的时候,一般都是存储到一个数组中进行获取,但是如果是二月份的话就需要首先判断是否闰年,再确定是28还是29了。 js可以通过Date对象很方便的获取到每月的天数,在初始化Date对象时,我们可以通…

第六届省赛(软件类)真题----Java大学C组答案及解析

第六届省赛(软件类)真题----Java大学C组答案及解析隔行变色立方尾无穷分数循环节长度格子中输出奇妙的数字加法变乘法移动距离打印大X垒骰子 一、隔行变色 Excel表的格子很多,为了避免把某行的数据和相邻行混淆,可以采用隔行变色的…

spring_01概念及案例

1.什么是IOC?   IOC概念:inverse of Controll,控制反转,所谓控制反转,就是把创建对象和维护对象关系的权利从程序中转移到spring的容器中(applicationContext.xml),而程序本身不再维护 2.什么是di? dependency injection,依赖注入,di和IOC是一个概念,spring的设计者认为di等…

斐波那契数列(二)--矩阵优化算法

之前写了一篇从斐波那契数列分析递归与动态规划(JAVA)来优化斐波那契数列,这样可以使算法的时间复杂度从O(n^2)变到O(n),这是使用递归公式f(n)f(n-1)f(n-2)求斐波那契数列的最优算法,但是这只是一维世界下的极限。下面我们将其从一…

第六届省赛(软件类)真题----Java大学B组答案及解析

第六届省赛(软件类)真题----Java大学B组答案及解析三角形面积立方变自身三羊献瑞循环节长度九数组分数加法变乘法牌型种数饮料换购垒骰子生命之树 一、三角形面积如【图1】所示。图中的所有小方格面积都是1。那么,图中的三角形面积应该是多少…

【学习总结】GirlsInAI ML-diary day-11-while循环

【学习总结】GirlsInAI ML-diary 总 原博github链接-day11 认识while循环执行 对于while/break/continue的认识 新值替换变量 一般while语句 无限循环 & break continue 作业 1-更新变量 这一条没什么新的东西,别的语言也一样:python在赋值时&#x…

第六届省赛(软件类)真题----Java大学A组答案及解析

第六届省赛(软件类)真题----Java大学A组答案及解析熊怪吃核桃星系炸弹九数分三组循环节长度打印菱形加法变乘法牌型种数移动距离垒骰子灾后重建一、熊怪吃核桃森林里有一只熊怪,很爱吃核桃。不过它有个习惯,每次都把找到的核桃分成…

@PathVariable、@RequestParam、@RequestBody注解

讲解更加详细的参考资料 https://blog.csdn.net/u011410529/article/details/66974974 https://www.cnblogs.com/soul-wonder/p/8920553.html PathVariable注解的作用,获取请求地址中传递的参数,即:从URL模版中取值。 RequestParam 是从reque…

从背包问题优化详解动态规划思想

动态规划: 所有的数据结构与算法的理解必须建立在题目的练习上,否则看多少理论都没有实际用处!!!所以下面这些理论文字看不懂通通没关系,跟随下面的背包问题还会跟深入的理解。一、基本概念:任何…

js判断数组里是否有重复元素的方法

转: js判断数组里是否有重复元素的方法 https://blog.csdn.net/longzhoufeng/article/details/78840974第一种方法:但是下面的这种方法数字字符串类似相同,返回的还是真,有点不靠谱,如果是其它的字符是可以的 var ary1…

深入浅出讲算法思想--蛮力法思想分析及应用

蛮力法(brute force method,也称为穷举法或枚举法)是一种简单直接地解决问题的方法,常常直接基于问题的描述,所以,蛮力法也是最容易应用的方法。虽然,用蛮力法设计的算法时间特性往往也是最低的…

光耦在短距离通信中的应用

在高低压隔离系统设计中,难免会使用光耦来通信。在选择光耦器件时,需要考虑光耦允许的最大通信速率,否则在高速通信时会失败. 对于高速的光耦应用时,需要注意电流传输比率和开关速度。 参考文档《Basic Characteristics and Appli…

减治法解决八枚硬币问题/假币问题(JAVA)----二分,三分,不知轻重的情况

八枚硬币问题 在八枚外观相同的硬币中,有一枚是假币,并且已知假币与真币的重量不同,但不知道假币与真币相比较轻还是较重。可以通过一架天平来任意比较两组硬币,设计一个高效的算法来检测出这枚假币。 我们先假设一个条件&#xf…

减治法在查找算法中的应用(JAVA)--折半查找

减治法在查找算法中的应用 折半查找:(时间复杂度O(log以2为底n的对数)) 对于有序数组的查找来说,折半查找是一种非常高效的算法,其基本原理为:比较查找键k和数组中间元素a[m],如果相等,算法结束&#xff…

牛客寒假算法基础集训营2 A处女座的签到题

处女座的签到题 链接:https://ac.nowcoder.com/acm/contest/327/A 题目描述 平面上有n个点,问:平面上所有三角形面积第k大的三角形的面积是多少?输入描述: 第一行T,表示样例的个数。对于每一组样例,第一行两个整数n和…

减治法解决约瑟夫斯问题(JAVA)

减治法在查找算法中的应用问题背景:据说著名犹太历史学家 Josephus有过以下的故事:在罗马人占领乔塔帕特后,39 个犹太人与Josephus及他的朋友躲到一个洞中,39个犹太人决定宁愿死也不要被敌人抓到,于是决定了一个自杀方…

从NetCore报错到MySql安全

从NetCore报错到MySql安全 原文:从NetCore报错到MySql安全之前项目在测试服务器上的一些接口时不时会报出下面的错误:(采用Abp框架) "SocketException: 你的主机中的软件中止了一个已建立的连接。 STACK TRACE: at MySqlConnector.Pr…

减治法在查找算法中的应用(JAVA)--快速查找

减治法在查找算法中的应用 快速查找:选择问题是求一个n个数列表的第k个最小元素的问题,这个数k被称为顺序统计量。对于k1或kn来说,这并没有什么意义,我们通常会要找出这样的元素:该元素比列表中一半元素大&#xff0…