angular2.x指令

【angular2.x指令】的更多相关文章

1.指令 *ngIf: 判断 isActive 为true时 <user-detail> 生效展示 <user-detail *ngIf="isActive"></user-detail> *ngFor:遍历显示 <div *ngFor="let user of users">{{user.fullName}}</div> ngClass:class为true类名text-success生效 [ngClas…

angular2 通过指令限制输入

最近在写一个表单,有些输入框只能输入数字,单又不想每次写表单的时候,都要去验证输入的是不是数字, 那么就想到直接限制只能输入数字,通过指令实现这里需要注意的是,不只更改DOM的值,如果input为数据绑定的值,需要更新绑定值, 所以需要引入NgModel,通过viewToModelUpdate,来更新绑定值 import { Directive } from '@angular/core'; import { NgModel } from '@angular/forms'; // 自定义指令…

ionic2 angular2 模板指令补充

向div中插入带有html标签的数据 [innerHTML]="item.content" 字符串截取指令 {{item.description|slice:0:49}} 指定循环次数 *ngFor="let item of sheng|slice:0:2"…

Angular2 从0到1 （二）

第一节:Angular2 从0到1 (一)第三节:Angular2 从0到1 (三)第四节:Angular2 从0到1 (四) 作者:王芃 wpcfan@gmail.com 第二节:用Form表单做一个登录控件对于login组件的小改造在 hello-angular\src\app\login\login.component.ts 中更改其模板为下面的样子 import { Component, OnInit } from '@angular/core'; @Component({ sele…

angular2项目关于Echarts图表的处理

在NiceFish项目中关于Echarts组件和指令是直接注册在appModule根模块中的,这样路由只需这样写就可以让浏览器加载图标组件: 在chart组件视图中: <div class="row" [@fadeIn]> <div class="col-sm-12"> <echart [chartType]="pieChart" class="nf-chart"></echart&g…

利用Angular2的Observables实现交互控制

在Angular1.x中,我们使用Promise来处理各种异步.但是在angular2中,使用的是Reactive Extensions (Rx)的Observable.对于Promise和Observable的区别,网上有很多文章,推荐egghead.io上的这个7分钟的视频(作者Ben Lesh).在这个视频的介绍中,主要说的,使用Observable创建的异步任务,可以被处理,而且是延时加载的.这篇文章里,我们主要针对一些在跟服务器端交互的时候遇到的问题,来看看Observable给我们带…