以下命令,都需要在命令行窗口中,先切入到项目文件夹目录,再执行

1.npm start

这个命令会在“监听”模式下运行TypeScript编译器,当代码变化时,它会自动重新编译。 同时,该命令还会在浏览器中启动该应用,并且当代码变化时刷新浏览器。

2.ng serve

运行web服务,(同时好像也能达到npm start的功能)

3.ctrl+c

是否终止web服务

4.npm install  <Module Name> ( 本地安装模块)

例:

npm install express

//使用 npm 命令安装常用的 Node.js web框架模块 express:

//安装好之后,express 包就放在了工程目录下的 node_modules 目录中,因此在代码中只需要通过 require('express') 的方式就好,无需指定第三方包路径。

var express = require('express');

全局安装与本地安装的区别

npm 的包安装分为本地安装(local)、全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如

npm install express          # 本地安装
npm install express -g # 全局安装

本地安装

  • 1. 将安装包放在 ./node_modules 下(运行 npm 命令时所在的目录),如果没有 node_modules 目录,会在当前执行 npm 命令的目录下生成 node_modules 目录。
  • 2. 可以通过 require() 来引入本地安装的包。

全局安装

  • 1. 将安装包放在 /usr/local 下或者你 node 的安装目录。
  • 2. 可以直接在命令行里使用。

如果你希望具备两者功能,则需要在两个地方安装它或使用 npm link

5.npm list -g 查看所有全局安装的模块

6.npm list express 查看某个模块的版本号

7.npm uninstall express 卸载模块

8.npm update express 更新模块

9.npm search express 搜索模块

angular2.0语法

1.[(ngModel)]

用与把变量绑定到输入框中。 它的数据流是双向的:从属性到输入框,并且从输入框回到属性。

例:<input [(ngModel)]="hero.name" placeholder="name">

使用时必须:

(1)在app.module.ts文件头部导入库符号

import {FormsModule} from '@angular/forms';

(2)然后把FormsModule添加到@NgModule元数据的imports数组中,即添加到当前应用正在使用的外部模块列表。

imports: [
    BrowserModule,
    FormsModule //加入到这里
  ]

2.*ngFor循环标签

ngFor*前缀表示<li>及其子元素组成了一个主控模板。例:

<li *ngFor="let hero of heroes">
    <span class="badge">{{hero.id}}</span> {{hero.name}}
  </li>

3.[class.cssname]

根据条件增加或移除css,

例:<li *ngFor="let hero of heroes" (click)="onSelect(hero)" [class.selected]="hero===selectedHero">选择我</li>

angular2.0学习笔记4.npm常用指令记录及angular语法的更多相关文章

  1. angular2.0学习笔记1.开发环境搭建 (node.js和npm的安装)

    开发环境, 1.安装Node.js®和npm, node 6.9.x 和 npm 3.x.x 以上的版本. 更老的版本可能会出现错误,更新的版本则没问题. 控制台窗口中运行命令 node -v 和 n ...

  2. angular2.0学习笔记5.关于组件

    1.组件文件应在/src/app文件夹下 2.组件文件命名应遵循小写中线形式,每个单词之间用中线分隔,并且以.component.ts结尾. 如:HeroDetailComponent类应该放在her ...

  3. angular2.0学习笔记3.了解angular2.0项目结构

    1.我们应用的代码都位于src文件中,包括所有的组件.模板.样式.图片以及我们的应用所需的任何东西都在这个文件来里. 2.src这个文件夹之外的文件都是为构建应用提供支持用的. src文件夹及用途说明 ...

  4. angular2.0学习笔记7.echarts 地图(type:'map')slice undifined 出错问题

    在 项目\node_modules\echarts\lib\chart\map.js文件头部 ... ... require("../coord/geo/geoCreator"); ...

  5. angular2.0学习笔记6.编程风格指南

    1.组件的类名应该是大驼峰形式,并且以Component结尾. 因此英雄详情组件的类名是HeroDetailComponent. 组件的文件名应该是小写中线形式,每个单词之间用中线分隔,并且以.com ...

  6. angular2.0学习笔记2.创建hello world项目

    1.打开终端命令行窗口 2.切换到指定目录 E:\cd myobject 3.创建新项目 ng new angular2-helloworld 4.创建成功后,在angular2-helloworld ...

  7. DirectX 总结和DirectX 9.0 学习笔记

    转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...

  8. amazeui学习笔记--css(常用组件6)--图标Icon

    amazeui学习笔记--css(常用组件6)--图标Icon 一.总结 1.关注用法即可:在 HTML 上添加添加 am-icon-{图标名称} class. <span class=&quo ...

  9. amazeui学习笔记--css(常用组件5)--评论列表Comment

    amazeui学习笔记--css(常用组件5)--评论列表Comment 一.总结 1.am-comment:使用am-comment来声明评论对象,这个是放在article里面的,虽然article ...

随机推荐

  1. Structs复习 Path问题

    Path问题相对复杂 主要是路劲问题 但结论很简单 就是统一使用绝对路径 jar包 web.xml <?xml version="1.0" encoding="UT ...

  2. GIS案例学习笔记-ArcGIS整图大图出图实例教程

    GIS案例学习笔记-ArcGIS整图大图出图实例教程 联系方式:谢老师,135-4855-4328,xiexiaokui#qq.com 1. 通过出图比例尺(1:2000),地图范围测算图纸大小. 图 ...

  3. centos 7.4安装教程

    1. 2. 3. 4. 5. 6. 7. 8.

  4. centos7 关闭 防火墙

    CentOS 7 默认使用的是firewall作为防火墙 关闭firewall: systemctl stop firewalld.service  #停止firewall systemctl dis ...

  5. JMeter学习(三)元件的作用域与执行顺序(转载)

    转载自 http://www.cnblogs.com/yangxia-test 1.元件的作用域 JMeter中共有8类可被执行的元件(测试计划与线程组不属于元件),这些元件中,取样器是典型的不与其它 ...

  6. 一、Iterator 迭代器

    需求:如何不适用for循环,依次遍历出数组中每个元素? 设计原理: 代码清单: 接口类 public interface Iterator { boolean hasNext(); Object ne ...

  7. Lattice Constants and Crystal Structures of some Semiconductors

    Lattice Constants and Crystal Structures of some Semiconductors and Other Materials Element or Compo ...

  8. 155. Min Stack (stack)

    Design a stack that supports push, pop, top, and retrieving the minimum element in constant time. pu ...

  9. vue初学:基础概念

    一.vue使用步骤: 1.引包vue.js 2.html中写要操作的DOM节点 3.创建vue对象:new Vue({options}); 4.配置options:el:(要操作的对象,用选择器,同j ...

  10. 【laravel VS lumen】

    读取项目的配置信息 读取config文件database.php中的default属性信息 laravel:config('database.default'); lumen:app()->co ...