angular2.0学习笔记4.npm常用指令记录及angular语法
以下命令,都需要在命令行窗口中,先切入到项目文件夹目录,再执行
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语法的更多相关文章
- angular2.0学习笔记1.开发环境搭建 (node.js和npm的安装)
开发环境, 1.安装Node.js®和npm, node 6.9.x 和 npm 3.x.x 以上的版本. 更老的版本可能会出现错误,更新的版本则没问题. 控制台窗口中运行命令 node -v 和 n ...
- angular2.0学习笔记5.关于组件
1.组件文件应在/src/app文件夹下 2.组件文件命名应遵循小写中线形式,每个单词之间用中线分隔,并且以.component.ts结尾. 如:HeroDetailComponent类应该放在her ...
- angular2.0学习笔记3.了解angular2.0项目结构
1.我们应用的代码都位于src文件中,包括所有的组件.模板.样式.图片以及我们的应用所需的任何东西都在这个文件来里. 2.src这个文件夹之外的文件都是为构建应用提供支持用的. src文件夹及用途说明 ...
- angular2.0学习笔记7.echarts 地图(type:'map')slice undifined 出错问题
在 项目\node_modules\echarts\lib\chart\map.js文件头部 ... ... require("../coord/geo/geoCreator"); ...
- angular2.0学习笔记6.编程风格指南
1.组件的类名应该是大驼峰形式,并且以Component结尾. 因此英雄详情组件的类名是HeroDetailComponent. 组件的文件名应该是小写中线形式,每个单词之间用中线分隔,并且以.com ...
- angular2.0学习笔记2.创建hello world项目
1.打开终端命令行窗口 2.切换到指定目录 E:\cd myobject 3.创建新项目 ng new angular2-helloworld 4.创建成功后,在angular2-helloworld ...
- DirectX 总结和DirectX 9.0 学习笔记
转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...
- amazeui学习笔记--css(常用组件6)--图标Icon
amazeui学习笔记--css(常用组件6)--图标Icon 一.总结 1.关注用法即可:在 HTML 上添加添加 am-icon-{图标名称} class. <span class=&quo ...
- amazeui学习笔记--css(常用组件5)--评论列表Comment
amazeui学习笔记--css(常用组件5)--评论列表Comment 一.总结 1.am-comment:使用am-comment来声明评论对象,这个是放在article里面的,虽然article ...
随机推荐
- Structs复习 Path问题
Path问题相对复杂 主要是路劲问题 但结论很简单 就是统一使用绝对路径 jar包 web.xml <?xml version="1.0" encoding="UT ...
- GIS案例学习笔记-ArcGIS整图大图出图实例教程
GIS案例学习笔记-ArcGIS整图大图出图实例教程 联系方式:谢老师,135-4855-4328,xiexiaokui#qq.com 1. 通过出图比例尺(1:2000),地图范围测算图纸大小. 图 ...
- centos 7.4安装教程
1. 2. 3. 4. 5. 6. 7. 8.
- centos7 关闭 防火墙
CentOS 7 默认使用的是firewall作为防火墙 关闭firewall: systemctl stop firewalld.service #停止firewall systemctl dis ...
- JMeter学习(三)元件的作用域与执行顺序(转载)
转载自 http://www.cnblogs.com/yangxia-test 1.元件的作用域 JMeter中共有8类可被执行的元件(测试计划与线程组不属于元件),这些元件中,取样器是典型的不与其它 ...
- 一、Iterator 迭代器
需求:如何不适用for循环,依次遍历出数组中每个元素? 设计原理: 代码清单: 接口类 public interface Iterator { boolean hasNext(); Object ne ...
- Lattice Constants and Crystal Structures of some Semiconductors
Lattice Constants and Crystal Structures of some Semiconductors and Other Materials Element or Compo ...
- 155. Min Stack (stack)
Design a stack that supports push, pop, top, and retrieving the minimum element in constant time. pu ...
- vue初学:基础概念
一.vue使用步骤: 1.引包vue.js 2.html中写要操作的DOM节点 3.创建vue对象:new Vue({options}); 4.配置options:el:(要操作的对象,用选择器,同j ...
- 【laravel VS lumen】
读取项目的配置信息 读取config文件database.php中的default属性信息 laravel:config('database.default'); lumen:app()->co ...