Angular2 Form之模板驱动
Web前端开发中,form表单的设计永远是重头戏,Angular 2提供了两种构建form表达的方式:模板驱动和模型驱动。其相应的处理方式以及API方面都有很大不同,本文先介绍我们最熟悉的模板驱动的form表单设计方式,包括ngForm
、ngModel
、ngModelGroup
、ngSubmit
等Angular 2在模板驱动中必不可少的directives。
Ionic 2神器之VirtualScroll
手机应用中,List控件必不可少,而对于List控件,最重要的是其滑动的效果如何。尤其是对于混合开发来说,对List的优化尤显重要。使用过Ionic 1的开发者应该都有如下体会:当中包含了大量的
时,滚动的卡顿效果尤其明显。而Ionic 2为我们提供了VirtualScroll改善此问题。
Ionic 2之页面堆栈
还记得Ionic 1中的state和router吗?他们两兄弟配合起来完成页面导航的功能,虽然它们使用起来并不算复杂,概念也很清晰,不过当页面增多、state嵌套等问题出现后复杂度也会增加,当复杂程度到达一定程度时工程必然难以维护和理解。而Ionic 2效仿原生页面堆栈的概念解决了上述问题。
Ionic单元测试
代码测试的必要性,对任何编程语言都毋需赘述,JavaScript和HTML自然不例外。本文描述如何对Ionic 1应用进行单元测试(Unit Tests),既然是单元测试,自然需要搭建测试环境和编写测试用例,大家可以随意选择,本文使用为Angular定制的Karma作为测试环境,并使用Jasmine编写测试用例。
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]
“对呀对呀!……回字有四样写法,你知道么?”,当时鲁大大如此讽刺孔乙己,意味着老孔这个被科举制毒害的人注意此种无用之物实在可悲。但是在Angular 2的世界中,很少存在无用之物,ngModel有三种写法,你知道吗?
自此使用Object字面量取代switch
几乎在所有主流编程语言中switch…case语句都占有一席之地,并且几乎所有介绍条件表达式的资料中都指示说当多条件判断时使用switch…case语句比if…else if…更具效率。在JavaScript中也不例外,switch…case语句在处理多条件判断时仍然很锋利,不过使用Object字面量完全可以取代它…
Angular 2 利用Router事件和Title实现动态页面标题
Angular2 为我们提供了名为Title的Service用于修改和获取页面标题,但是如果只是能够在每个页面的ngOnInit方法中为每个页面设置标题岂不是太low了,不符合Angular2高(zhuang)大(bi)的身影。我们想要的结果是在页面改变时能够动态地改变页面标题,如此最好的解决方案就是组合使用Router事件和Title Service。
Angular 2 父子组件数据通信
如今的前端开发,都朝组件式开发模式靠拢,如果使用目前最流行的前端框架Angular和React开发应用,不可避免地需要开发组件,也就意味着我们需要考虑组件间的数据传递等问题。而Angular 2中通过事件机制为我们提供了很好的解决方案。
Angular之constructor和ngOnInit差异及适用场景
Angular中根据适用场景定义了很多生命周期函数,其本质上是事件的响应函数,其中最常用的就是ngOnInit。但在TypeScript或ES6中还存在着名为constructor的构造函数,那ngOnInit和constructor之间有什么区别呢?它们各自的适用场景又是什么呢?