Angular js 双向绑定时字符串的转换成 数字类型的问题
问题：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp"> <p ng-controller = "myContrl">结果为 <span ng-bind="" ></span>
<input type="text" ng-model="first">{{first+second}}
</p>
</div>
<script>
var app = angular.module("myApp",[]);
app.controller("myContrl",function($scope){
$scope.first = 5;
$scope.second =10;
});
</script>
</body>
</html>
显示结果为
但是，我要是输入50，想要结果为60
因为这个是字符串类型需要转换成数字类型
解决方法：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp"> <p ng-controller = "myContrl">结果为 <span ng-bind="" ></span>
<input type="text" ng-model="first">{{first *1+second*1}}
</p>
</div>
<script>
var app = angular.module("myApp",[]);
app.controller("myContrl",function($scope){
$scope.first = 5;
$scope.second =10;
});
</script>
</body>
</html>
显示即可正常 即是在 {{first *1+second*1}}显示的时候，转换了一下
或者，启用事件监听
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp"> <p ng-controller = "myContrl">结果为 <span ng-bind="" ></span>
<input type="text" ng-model="first">{{total}}
</p>
</div>
<script>
var app = angular.module("myApp",[]);
app.controller("myContrl",function($scope){
$scope.first = 5;
$scope.second =10;
$scope.total = parseInt($scope.first)+parseInt($scope.second);
$scope.$watch(function(){
return $scope.first;
},function(newValue,oldValue){
if(newValue != oldValue){
$scope.total = parseInt($scope.first)+parseInt($scope.second);
}
});
});
</script>
</body>
</html>
也能输出正确结果
Angular js 双向绑定时字符串的转换成 数字类型的问题的更多相关文章
- Swift - 将String类型的数字转换成数字类型
Swift中,如果要把字符串转换成数字类型(比如整型,浮点型等).可以先转成NSString类型,让后再转. 1 2 3 4 //将文本框中的值转换成数字 var i = (tf1.text as N ...
- Swift - 将String类型的数字转换成数字类型（支持十进制、十六进制）
1,十进制的字符串转成数字 Swift中,如果要把字符串转换成数字类型(比如整型,浮点型等).可以先转成NSString类型,让后再转. 1 2 3 4 //将文本框中的值转换成数字 var i = ...
- [C#]将千分位字符串转换成数字
关键代码: /// <summary> /// 将千分位字符串转换成数字 /// 说明:将诸如"–111,222,333的千分位"转换成-111222333数字 /// ...
- Vue.js双向绑定的实现原理和模板引擎实现原理（##########################################）
Vue.js双向绑定的实现原理 解析 神奇的 Object.defineProperty 这个方法了不起啊..vue.js和avalon.js 都是通过它实现双向绑定的..而且Object.obser ...
- Angular数据双向绑定
Angular数据双向绑定 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.Angul ...
- js 字符串转换成数字的三种方法
在js读取文本框或者其它表单数据的时候获得的值是字符串类型的,例如两个文本框a和b,如果获得a的value值为11,b的value值为9 ,那么a.value要小于b.value,因为他们都是字符串形 ...
- js 字符串转换成数字(转)
转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的 ...
- JavaScript进阶(四)js字符串转换成数字的三种方法
js字符串转换成数字的三种方法 在js读取文本框或者其它表单数据的时候获得的值是字符串类型的,例如两个文本框a和b,如果获得a的value值为11,b的value值为9 ,那么a.value要小于b. ...
- js字符串转换成数字与数字转换成字符串的实现方法
转载:点击查看地址 js字符串转换成数字 将字符串转换成数字,得用到parseInt函数.parseInt(string) : 函数从string的开始解析,返回一个整数. 举例:parseInt(' ...
随机推荐
- rest-assured的日志使用介绍
在许多测试用例当中,为了帮助我们创建正确的断言和发送正确的请求,打印出详细的响应和请求数据是非常有用的.为此我们可以使用rest-assured提供的预定义过滤器或者使用其中的一些快捷方法. 一.请求 ...
- sharepoint_study_1
描述:机器上进行SharePoint开发,需要SQL Server提供最基本的服务 解决: SQL Server 的数据库引擎: SQL Server 代理: SQL Server 浏览器组件:
- 设置select不可修改
<s:select id="notSelectChange" list="#{'1':'表示每月几号','2':'表示每季度第几天','3':'表示每年第几月'}& ...
- SQL中的object_id函数
关于SQL中的object_id函数:应该就是指系统表中存储着数据库的所有对象 每一个对象都有一个唯一的标识符Id进行标识object_id 就是根据对象名称返回改对象的Idobject_name 就 ...
- python练习七十：图片生成
题目:使用python生成类似于下图的字母验证码图片 实现代码: from PIL import Image,ImageFont,ImageDraw,ImageFilter import random ...
- Java基础19-封装、方法重载、构造方法（构造函数）
1.封装 封装就是把不想或者不该告诉别人的东西隐藏起来,把可以告诉别人的公开 做法:修改属性的访问权限来限制对属性的访问.并为每一个属性创建一对取值方法和赋值方法,用于对这些属性的访问 class D ...
- (转)shell脚本之seq命令
shell脚本之seq命令 原文:http://blog.csdn.net/paoxiaohui/article/details/52830595 seq 用于生成从一个数到另一个数之间的所有整数. ...
- node之Express框架
Express是node的框架,通过Express我们快速搭建一个完整的网站,而不再只是前端了!所以Express还是非常值得学习的! express有各种中间件,我们可以在官方网站查询其用法. Ex ...
- SQL Server 2008 SQL2012 SQL2014 收缩日志 清空删除大日志文件
SQL2008 SQL2012 SQL2014 的收缩日志 由于SQL2008对文件和日志管理进行了优化,所以以下语句在SQL2005中可以运行但在SQL2008中已经被取消:(SQL2005)Bac ...
- 【MFC】消息大全
转自:http://www.cnblogs.com/orez88/articles/2119450.html 消息,就是指Windows发出的一个通知,告诉应用程序某个事情发生了.例如,单击鼠标.改变 ...