前言 大家都知道angualrjs处于安全的考虑，插值 指令会对相应字符串进行过滤，避免出现html攻击。但是在一些时候，我们需要渲染html，比如实现一个分级的下拉框 代码如下： <body ng-app="app" ng-controller="controller"> <select ng-model="value" ng-options="t.text for t in testList"></select> <script src="/bootstrap/bootstrap/dist/angular-bootstrap/angular.js"></script> <script type="text/javascript">var app= ...
本文实例讲述了基于AngularJS实现的工资计算器。分享给大家供大家参考，具体如下： 先看界面：其实在ng中最让人印象深刻的就是数据的双向绑定，在html中就完成了很多操作。大概用到的就是控制器视图服务等，没有分模块写控制器，代码如下： <html ng-app = "myApp"> <head><title>工资计算器ng</title><script src= "angular.js"></script> </head> <body><div ng-controller = "MyController">税前工资：<input ng-model="salary....
昨天在做app的聊天列表时，遇到了一个问题，消息监听器监听到了一个新的消息，但是如果这时已经处于消息列表的页面那么消息列表并不会及时更新。 我的想法是在service层中的监听器方法里，当监听到了一个新的消息，那么就在根作用域中发出一个广播，告诉controller层需要去获取最新的消息列表了。 service层中发出广播:controller层中接听广播:rootScope是所有scope的父级 它的广播(broadcast)和监听(on) 可以在无交集的controller...
1、定义高亮 filter我们希望搜索的关键字在正文中高亮出来，正文内容就是过滤器的第一个参数，第二个参数就是搜索关键字，这样，我们的过滤器将会有两个参数了。 高亮的原理很简单，将需要高亮的内容使用 span 标记隔离出来，再加上一个高亮的 class样式 进行描述就可以了。 app.filter("highlight", function($sce, $log){var fn = function(text, search){$log.info("text: " + text);$log.info("search: " + search);if (!searc...
前言 之前跟大家分享了关于 Android 原生实现验证码倒计时，地址是这里，现在公司使用 Ionic 开发的 App 也要实现类似的功能，现在也记录下来，供大家参考： 效果图：正文 首先介绍下与本文相关的概念 $interval $interval 是 window.setInterval 的 Angular 包装形式，函数如果在没有被取消的时候会无限执行。（取消使用 cancel(promise) ） 用法： $interval(fn,delay,[count],[invokeApply],[Pass]);参数说明： fn : 无限执行的...
虽说AngularJS 1.x版本中对于上拉加载，下拉刷新数据功能都有做些封装，但还是有些人不清楚。其实我一开始也是不懂的，so.现在把搞懂的记录下免得少走弯路。 now,begin:先说下拉刷新吧，原理就是每次下拉都重新去服务器请求过一次新的数据。一般这种刷新功能的响应数据（也就是服务器返回的（json）数据）中都会带有 "rowsOfPage": 3,"currentPage": 1,"totalPages": 10,"totalRows": 40,"rowsOfPage":10,"minRowNumber": 1,"maxRo...
AngularJS 异步解决实现方法 Angular 的异步处理的真的很不错。基于消息广播的方式，并且可以向上传递，基本上解决了不同模块，不同controller之间不方便异步的问题。 场景一：通过回调函数进行异步操作(该情况下不用消息广播的机制) 这种情况的特点是直接传递一个回调函数给异步操作就可以了，等异步操作完执行回调。 比如：controller通过server异步取数据，等取完数据进行一系列的操作，这个时候就可以...
这段时间的主业是完成一个家政类小程序，终于是过审核发布了。不得不说微信的这个小程序生态还是颇有想法的，抛开他现有的一些问题不说，其提供的组件系统乍一看还是蛮酷的。比如其提供的一个叫swiper的视图组件，就可以在写界面的时候省不少时间和代码，轮播图片跟可滑动列表都可以用。导致现在回来写angular项目时也想整一个这样的组件出来，本文就将使用angular的组件能力和服务能力完成这么一个比较通用，耦合度较低的swiper出...
这两天一直纠结angular的图片懒加载插件中无法自拔。在使用过程深深感到js学艺不精的痛苦，想修改源码又不会修改，只能尽力压榨如何使用插件上。这里主要谈谈在使用插件的过程遇到的一些问题。 一）我使用的是angular-imglazyload这个插件。【https://www.npmjs.com/package/angular-imglazyload】主要是这个插件小不依赖jquery库，然后下载源码运行成功后，我就整合到自己项目上运行，结果发现竟然只有前2张加载了，滚动了都没有...
本文介绍了angularJs中datatable实现，有需要的小伙伴可以参考下 html引用derective:代码如下: <table datatable dtOptions="dtOptionsExample2" class="table table-striped m-b-none"></table>controller设置：$scope.dtOptions = { "bProcessing": true, "bServerSide": true, iDisplayLength: 5, sAjaxSource: http://10.188.192.200:8080/employee/page?deptId=+ data, sAjaxDataProp: aaData, "sDom": "<row<col-sm-6l...
说明： 1、前端只负责展示倒计时，不具备实际功能； 2、实际实现方式：数据库中设置一个每分钟执行一次的定时任务（故与实际情况会有一分钟以内的误差），只要订单创建时间超过15分钟会自动将订单状态改为“取消”。 遇到难点： 1、字符串转date中，苹果satari浏览器不支持“yyyy-mm-dd hh:mi:ss”格式，须将字符串转为“yyyy/mm/dd hh:mi:ss” new Date($scope.order.createtime.replace(/\-/g, "/")) 2、AngularJS 对JavaScript自...
最近在做AngularJS 项目，这是写的一个60秒倒计时, angularjs 与jq不同， 不是使用dom节点操作，而是数据操作，写倒计时，最好是使用$timeout与$interval ，不要使用settimeout与setinterval 。$timeout与$interval 可使绑定数据直接更新。 html <a href="javascript:" rel="external nofollow" ng-click="sendphonecode(reg_phone)" ng-class="paraclass" ng-bind="paracont">获取验证码</a> angularjs angular.module(controlle...
如果我们具有下面的DOM结构：<div ng-controller="MyCtrl"> <loader>滑动加载</loader> </div> 同时我们的控制器具有如下的签名： var myModule = angular.module("MyModule", []); //首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的 myModule.controller(MyCtrl, [$scope, function($scope){ $scope.loadData=function(){ console.log("加载数据中..."); } }])...
前言 有时候需要根据URL来渲染不同组件，我所指的是在同一个URL地址中根据参数的变化显示不同的组件；这是利用Angular动态加载组件完成的，同时也会设法让这部分动态组件也支持AOT。 动态加载组件 下面以一个Step组件为示例，完成一个3个步骤的示例展示，并且可以通过URL userstep=step-one 的变化显示第N个步骤的内容。 1、resolveComponentFactory 首先，还是需要先创建动态加载组件模块。 import { Component, Input, ViewConta...
实现下面这样的需求：点击增加一块数据盘，会出现数据盘选项。 (1)最开始，想到原生JavaScript，jQuery (appendChild()等方法结合AngularJS来添加新的元素。但是突然发现控件里面的数据绑定，原生javascript没法控制。 (2)上网查资料，找到$compile服务，动态改变html内容。本以为这可以解决我的需求，但是仔细研究发现$compile是这样的东西。 用$compile服务创建一个directive ‘compile，这个complie会将传入的html字符串或者DOM...