在安装了node,npm,angular-cli,vscode之后,我们来创建一个angular的应用

创建第一个hello world

使用的IDE工具为vscode

打开vscode,打开一个命令行窗口(terminal)

然后定位到希望放置应用的目录(我的是:D:\github\angular.js\code),输入:ng new hello-angular(这个就是应用的名称)

出现Project 'hello-angular' successfully created.表示应用的基本框架创建完成!

然后到目录中查看,会有一个hello-angular文件夹生成

在命令框继续输入code,会再打开一个vscode

打开刚才生成的文件夹

我们可以在vscode中看到项目的目录结构,基本上我们只需要关心src目录,因为这个是我们放置代码的地方

然后启动服务,运行应用

在命令行输入:cd hello-angular

输入:ng server(也就是要在hello-angular目录运行)

出现下面说明运行成功

打开浏览器,输入:http://localhost:4200/

回到vscode,修改src/app/app.component.ts的title,保存,然后回到浏览器

浏览器不用刷新,结果已经更新,这叫做热加载,这种特性使得开发变得方便。

ok!我们的第一个angular的hello world创建成功了!

Angular的第一个helloworld的更多相关文章

  1. Webpack入门——使用Webpack打包Angular项目的一个例子

    2016.1.22,对大多数人来说,这是一个非常平常的日子,但这却是我决定在博客园写博客的日子.虽然注册博客园的博客已有4年8个月,却一直没有动手写过一篇博客,原因是觉得自己水平不行,写不出好东西,所 ...

  2. zynq学习01 新建一个Helloworld工程

    1,好早买了块FPGA板,zynq 7010 .终极目标是完成相机图像采集及处理.一个Window C++程序猿才开始学FPGA,一个小菜鸟,准备转行. 2,关于这块板,卖家的官方资料学起来没劲.推荐 ...

  3. Android Studio新建一个HelloWorld 程序(App)

    Android Studio新建一个HelloWorld程序(App) 新建 或者直接启动程序(注:如果已有程序,此方法会直接打开最近一次关闭从程序) 更改App名 选择App运行平台 选择模板 更改 ...

  4. [浅学] 1、Node.js尝试_安装&运行第一个helloworld

    官网:https://nodejs.org/ 介绍:Node.js® is a platform built on Chrome's JavaScript runtime for easily bui ...

  5. 2.每人自己建立一个HelloWorld项目,练习使用git的add/commit/push/pull/fetch/clone等基本命令。比较项目的新旧版本的差别。答题人:张立鹏

    第1步:创建SSH Key.在用户主目录下,看看有没有.ssh目录,如果有,再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件,如果已经有了,可直接跳到下一步.如果没有,打开Shell ...

  6. 第二章——建立一个HelloWorld项目,练习使用git的add/commit/push/pull/fetch/clone等基本命令。比较项目的新旧版本的差别-----答题者:徐潇瑞

    1.首先下载安装git,很简单所以就不详细说了,当弹出一个类似的命令窗口的东西,就说明Git安装成功 2.因为Git是分布式版本控制系统,所以需要填写用户名和邮箱作为一个标识 3.接着,注册githu ...

  7. 使用Spring开发第一个HelloWorld应用

    http://www.importnew.com/13246.html 让我们用Spring来写第一个应用程序吧. 完成这一章要求: 熟悉Java语言 设置好Spring的环境 熟悉简单的Eclips ...

  8. Django官方文档学习1——第一个helloworld页面

    Django 1.10官方文档:https://docs.djangoproject.com/en/1.10/intro/tutorial01/ 1.查看django版本 python -m djan ...

  9. 用Spring3编写第一个HelloWorld项目

    第一个HelloWorld程序 让我们用Spring来写第一个应用程序吧. 完成这一章要求: 熟悉Java语言 设置好Spring的环境 熟悉简单的Eclipse IDE的操作 如果你还没有设置好环境 ...

随机推荐

  1. ASP.NET Core使用EF Core操作MySql数据库

    ASP.NET Core操作MySql数据库, 这样整套环境都可以布署在Linux上 使用微软的 Microsoft.EntityFrameworkCore(2.1.4) 和MySql出的 MySql ...

  2. FFmpeg命令详解

    命令格式 功能 FFmpeg命令是在ffmpeg.exe可执行文件环境下执行,ffmpeg.exe用于音视频的转码,加水印,去水印,视频剪切,提取音频,提取视频,码率控制等等功能. 最简单的命令 ff ...

  3. Day 31 面向对象考试题 第四次考试.

    一 基础知识和函数: 1.文件操作有哪些模式?请简述各模式的作用 r ,只读模式[默认模式,文件必须存在,不存在则抛出异常] w,只写模式[不可读:不存在则创建:存在则清空内容] x, 只写模式[不可 ...

  4. django系列5.4--ORM中执行原生SQL语句, Python脚本中调用django环境

    ORM执行原生sql语句 在模型查询API不够用的情况下,我们还可以使用原始的SQL语句进行查询. Django 提供两种方法使用原始SQL进行查询:一种是使用raw()方法,进行原始SQL查询并返回 ...

  5. series dataframe 的 idxmax()

    返回最大值的索引

  6. 《Python绝技:运用Python成为顶级黑客》 用Python分析网络流量

    1.IP流量将何去何从?——用Python回答: 使用PyGeoIP关联IP地址和物理地址: 需要下载安装pygeoip,可以pip install pygeoip 或者到Github上下载安装htt ...

  7. 协程IO多路复用

    协程:单线程下实现并发并发:伪并行,遇到IO就切换,单核下多个任务之间切换执行,给你的效果就是貌似你的几个程序在同时执行.提高效率任务切换 + 保存状态并行:多核cpu,真正的同时执行串行:一个任务执 ...

  8. Java并发工具类之CountDownLatch

    CountDownLatch允许一个或则多个线程等待其他线程完成操作. 假如我们有这样的需求:我们需要解析一个excel文件中的多个sheet,我们可以考虑使用多线程,每一个线程解析excel中的一个 ...

  9. 使用win10自带邮件应用发送文件

    之前的电脑装过邮件客户端,想发送文件给别人时,只需要“右键文件——发送到邮件”,就能把文件作为附件发送给对方.新电脑win10系统自带邮件客户端,所以就想直接用.但是右键发送到邮件没有关联上,用不了. ...

  10. oauth三方登陆的原理

    一 说明 OAuth是由Blaine Cook.Chris Messina.Larry Halff 及David Recordon共同发起的,目的在于为API访问授权提供一个开放的标准(resful和 ...