• AngularJs中用到的相关指令总结

    这里是在学习的过程中,总结的AngularJs中用到的相关指令,并且在持续更新中。...

    阅读(987) 2016-12-14
    AngularJs中用到的相关指令总结
  • 1、AngularJs简介、指令、表达式及其作用

    一、什么是AngularJs?它的作用是什么? AngularJS是一个JavaScript框架。它可通过 标签添加到HTML页面。通过指令扩展了HTML,且通过表达式绑定数据到HTML。AngularJS 使得开发现代的 单一页面...

    阅读(654) 2016-12-11
    1、AngularJs简介、指令、表达式及其作用
  • 2、AngularJs的模型、控制器、视图之间的关系

    想要熟练的使用AngularJs构建应用,那就必须清楚的了解它的模型(Model)、控制器(Controller)、视图(View)以及ViewModel之间的关系。 1、Model:它是与应用程序的业务逻辑相关的数据的...

    阅读(389) 2016-12-30
    2、AngularJs的模型、控制器、视图之间的关系
  • 3、AngularJS中$scope的基本使用方法

    AngularJS中$scope的基本使用方法,先看一段代码: !doctype htmlhtml lang=enheadmeta charset=UTF-8 /titleDocument/titlescript type=text/javascript src=../js/angular.min.js/script/headbodydiv ng-app=app ng-controller=ctrlinput t...

    阅读(272) 2016-12-11
  • 4、AngularJs表达式与ng-bind及ng-cloak解决闪屏问题解决方案

    使用AngularJs获取数据之后,可以使用双花括号表达式或者是ng-bind指令把数据添加到html中,但是这里涉及到一个前端页面渲染与性能的问题。 如果把js文件放在head头部,这时用户网络不好...

    阅读(680) 2016-12-11
  • 5、AngularJs中的双向向数据绑定(MVVM)与表单处理相关指令

    AngularJs有一个很强大的功能就是双向数据绑定,即MVVM,什么是双向数据绑定呢? 在一般的应用当中,后端给前端返回数据,前端数据发生改变,如果不做表单或者是ajax数据提交,这些...

    阅读(416) 2016-12-30
  • 6、AngularJs函数之大小写转换、对象深拷贝、对象扩充、数据遍历

    今天来学习下AngularJs的函数使用方法: 1、打印AngularJs的版本号: var m = angular.module(app, []);m.controller(ctrl, [$scope, function($scope){console.log(angular.version);}]); 2、大小写转换: var m = angular.mod...

    阅读(239) 2016-12-12
  • 7、AngularJs将json字符串转为对象fromJson和将对象转为json字符串toJson

    在AngularJs中,json形式的字符串可以转为json格式的对象,代码如下: 利用HTML5的2种本地存储方式(localStorage和sessionStorage)来做测试: var m = angular.module(app, []);m.controller(ctrl, [$scope, fun...

    阅读(362) 2017-06-27
  • 8、AngularJs中的数据比较函数

    下面是总结的部分AngularJs的比较函数: !DOCTYPE htmlhtml lang=enheadmeta charset=UTF-8titleDocument/titlestyle type=text/css.ng-cloak{display:none;}/style/headbody ng-app=app ng-controller=ctrl ng-cloak class=ng-cloakdiv id=wra...

    阅读(150) 2016-12-14
  • 9、AngularJs使用ng-repeat实现数据循环展示的效果

    一般情况下,后端给前端传输数据,前端都是用foreach来循环输出,现在使用AngularJs也能实现类似的功能,方法如下: !doctype htmlhtml lang=enheadmeta charset=UTF-8titleDocument/titlemeta name=Keywords...

    阅读(829) 2016-12-13
  • 10、AngularJs使用ng-model-options设置数据同步时机提高网站性能

    之前讲过ng-model可以实时改变数据,实现双向数据绑定,但是如果数据是联通后台的,那么当就会实时与后台进行交互,肯定会增加后台的压力,影响性能,比如以下代码: input type=t...

    阅读(315) 2016-12-14
  • 11、AngularJs使用ng-checked一步实现全选或取消功能

    AngularJs使用ng-checked一步实现全选或取消功能,代码如下: !doctype htmlhtml lang=enheadmeta charset=UTF-8 /titleDocument/titlestyle type=text/css.ng-cloak{display:none;}td{height:30px;line-height:30px;padding:0px 10px;}/s...

    阅读(327) 2016-12-14
  • 12、AngularJs通过ng-class动态改变样式类实例操作

    AngularJs通过ng-class动态改变样式类实例操作,代码如下: !doctype htmlhtml lang=enheadmeta charset=UTF-8 /titleDocument/titlestyle type=text/css.ng-cloak{display:none;}td{height:30px;line-height:30px;padding:0px 10px;}.red...

    阅读(373) 2016-12-14
  • 13、AngularJS使用ng-style动态改变样式

    AngularJS使用ng-style动态改变样式,代码如下: !doctype htmlhtml lang=enheadmeta charset=UTF-8 /titleDocument/titlestyle type=text/css.ng-cloak{display:none;}/style/headbody ng-app=app ng-controller=ctrl ng-cloak class=ng-cloak...

    阅读(305) 2016-12-14
  • 14、AngularJs的事件处理指令详解

    AngularJs的事件处理指令测试如下: 今天统一用到的JavaScript代码如下: var m = angular.module(app, []);m.controller(ctrl, [$scope, function($scope){$scope.data = 赵一鸣技术博客;$scope.func = function(){alert($sc...

    阅读(183) 2016-12-14
  • 15、AngularJs中的过滤器使用方法总结【持续更新】

    今天学习下AngularJs中的过滤器使用方法: 第一种:通过表达式进行过滤 过滤器可以通过一个管道字符(|)和一个过滤器添加到表达式中。 1、uppercase 过滤器将字符串格式化为大写:...

    阅读(298) 2017-03-09
  • 16、AngularJs通过$scope和$watch监听数据变化

    AngularJs通过$scope和$watch可以检测数据的变化,从而提醒用户进行正确的操作,具体方法如下: !DOCTYPE htmlhtml lang=enhead meta charset=UTF-8 titleTitle/title style type=text/css .ng-cloak{display:none;} /styl...

    阅读(2669) 2016-12-15
  • 17、AngularJS使用$watch与$filter过滤器制作数据筛选实例

    AngularJS使用$watch与$filter过滤器制作数据筛选实例,代码如下: 在搜索框中输入不同文字,然后表格中展示相应的搜索结果: !DOCTYPE htmlhtml lang=enhead meta charset=UTF-8 titleTitle/title style typ...

    阅读(206) 2016-12-15
  • 18、AngularJs自定义过滤器的方法

    AngularJs提供了自定义过滤器的方法,如果现有的过滤器不能完全支持业务需求,那我们可以通过扩展的方法来实现: 比如我要把一个手机号的后3位数字变成【*】星号,代码如下: !D...

    阅读(253) 2016-12-15
  • 19、AngularJs通过directive和restrict自定义指令

    一、AngularJs自定义指令directive的restrict属性说明: 今天公用的html部分: h1 zym-blog/h1 JavaScript部分: var m = angular.module(app, []);m.directive(zymBlog, [function(){return {restrict : AEC,template : phello worl...

    阅读(712) 2017-06-27