Currency 货币 filter
angularjs 其实也有一个currency指令,不过好像只是换符号而已。
这里自己写了一个简单的兑换率filter
<div ng-controller="ctrl">
<div>{{ 100 | myCurrency}}</div>
<div ng-click="change1('SGD')">change</div>
</div> angular.module("Main", dependentModuleList).
controller("ctrl", function ($scope, currencyService) {
$scope.change1 = function (code) {
currencyService.changeCodeTo(code);
};
});
调用大概是这样的 , 100 应该变成 USD 100.00 ,点击事件后就兑换成 SGD xx.xx
angular.module("Currency", []).
provider("currencyService", [function () {
var that = this;
this.defaultCode = "USD"; //允许通过provider修改
this.$get = ["$rootScope", function ($rootScope) {
var COOKIE_KEY = "currecyCode";
var SERVICE_PATH = "//service.stooges.com.my/currency.ashx?defaultCode=" + that.defaultCode; //这里可以请求一个当前的 rate table (来自 http://www.xe.com/currencytables)
var defaultCode = that.defaultCode;
var currentCode = G.s.Cookie.get(COOKIE_KEY) || defaultCode;
var rateColletion = {}; //{USD:3.1538542348}
var ajaxing = false; function getRateFromServer() {
ajaxing = true;
G.s.fn.jsonp(SERVICE_PATH).then(function (response) {
ajaxing = false;
rateColletion = JSON.parse(response).data;
$rootScope.$digest(); //手动渲染
}, function () {
console.log("get currency rate table fail !");
});
}
function getMoneyFormat(money, code) {
return code + " " + (parseFloat(money).toFixed(2));
}
return {
changeCodeTo: function (code) {
currentCode = code; //请在外部digest
G.s.Cookie.set(COOKIE_KEY, currentCode, new Date().addMonths(1));
},
convertMoney: function (money) {
if (defaultCode === currentCode || ajaxing) { //正在向服务器请求的话也直接返回
return getMoneyFormat(money, currentCode);
}
var rate = rateColletion[currentCode];
if (rate != undefined) {
return getMoneyFormat(money / rate, currentCode); //这里是用除法
}
else {
getRateFromServer(); //第一次得向服务器请求rate表格
return getMoneyFormat(money, currentCode);
}
}
}
}]
}]).
filter("myCurrency", ["$rootScope", "currencyService", function ($rootScope, currencyService) {
//手动调用的话要注意, 如果没有rate,会直接返回原value
return function (money) {
return currencyService.convertMoney(money);
}
}]);
过程是通过渲染时判断当前货币然后去服务端获取兑换率表格进行兑换。这里用的是一个jsonp请求。
需要判断只请求一次,请求返回时得手动渲染。
Currency 货币 filter的更多相关文章
- 程序猿的量化交易之路(21)--Cointrader之Currency货币实体(9)
转载须注明出自:http://blog.csdn.net/minimicall? viewmode=contents,http://cloudtrader.top 货币,Cointrader中基本实体 ...
- angularjs之filter过滤器
现在公司用ionic,就是基于angularjs封装了一些api用于webapp,最近用的angularjs的filter确实省了很多代码,现在总结一下! ng比较鸡肋的过滤器,这里就一笔带过吧!鸡汤 ...
- 走进AngularJs(七) 过滤器(filter)
过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它们 ...
- 走进AngularJs(七) 过滤器(filter) - 吕大豹
时间 2013-12-15 16:22:00 博客园-原创精华区 原文 http://www.cnblogs.com/lvdabao/p/3475426.html 主题 AngularJS 过滤器 ...
- 详解AngularJS中的filter过滤器用法
系统的学习了一下angularjs,发现angularjs的有些思想根php的模块smarty很像,例如数据绑定,filter.如果对smarty比较熟悉的话,学习angularjs会比较容易一点.这 ...
- AngularJs--过滤器(filter)
过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它们 ...
- angularjs filter 详解
系统的学习了一下angularjs,发现angularjs的有些思想根php的模块smarty很像,例如数据绑定,filter.如果对smarty比较熟悉的话,学习angularjs会比较容易一点.这 ...
- Angular之filter学习
过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它们 ...
- AngularJS的过滤器$filter
过滤器(filter)主要用于数据的格式上,通过某个规则,把值处理后返回结果.例如获得数据集,可排序后再返回. ng内置的共有九种过滤器: currency 货币 使用currency可以将数字格式化 ...
随机推荐
- [转载]Android开发必备的21个免费资源和工具
转载自: http://blog.csdn.net/shimiso/article/details/6788375 Android移动开发平台现在不是一个“火”字能形容的,今年Android平台在市场 ...
- java排序算法-插入排序
public class InsertSortUtils { public static void main(String[] args) { insertSortTest(); shellSortT ...
- HTTP学习笔记3-响应结构
HTTP响应: 13,在接收和解释请求消息后,服务器会返回一个HTTP响应消息. 14,与HTTP请求类似,HTTP响应也是由三个部分组成,分别是:状态行.消息报头.响应正文. 15,状态行由协议版本 ...
- android 中如何限制 EditText 最大输入字符数
方法一: 在 xml 文件中设置文本编辑框属性作字符数限制 如:android:maxLength="10" 即限制最大输入字符个数为10 方法二: 在代码中使用InputFilt ...
- 【剑指offer】链表倒数第k个节点
转载请注明出处:http://blog.csdn.net/ns_code/article/details/25662121 在Cracking the Code Interview上做过了一次,这次在 ...
- 使用Intent实现Activity的隐式跳转
相比于显式Intent,隐式Intent 则含蓄了许多,它并不明确指出我们想要启动哪一个活动,而是指定了一系列更为抽象的action 和category 等信息,然后交由系统去分析这个Intent,并 ...
- [转] boost::any的用法、优点和缺点以及源代码分析
boost::any用法示例: #include <iostream> #include <list> #include <boost/any.hpp> typed ...
- jquery跳出当前的each循环
break----用return false; continue --用return ture; jquery是对象链,所以$(..).each()返回的还是对象集合.each(function(){ ...
- IIS配置
IIS配置文档: 1.安装IIS.控制面板→程序→打开关闭Windows功能,Web管理服务和万维网服务都勾上. 2.部署网站:ASP.Net项目的发布:项目中点右键“发布”,选择“文件系统”,发布到 ...
- 小学生之使用Mybatis反向生成dao,entity,xml
本小学生刚进公司的时候,就一顿装逼,不管别人问我啥我都会说:"会"!毕竟在公司吗,什么都要装,不要别人看出你的底细.不过有一天,听说用Mybatis可以反向生成dao(第一次听说) ...