angular2.0学习笔记4.npm常用指令记录及angular语法

时间：2024-07-04 18:04:08

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

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>

相关文章