AngularJs 中ngModel绑定HTML5 date数据同步问题
以下代码例子中,直接将date类型的input标签与ng-model对应的变量绑定,会出现内存数据和页面数据不一致的问题。虽然AngularJS是双向数据绑定,但是如果用下面的方法,在页面更新date的内容时,内存中的$scope.testDate不会改变;在内存中更新$scope.testDate,页面上的日期也不会改变。
<input type="date" name="testDate" ng-model="testDate" placeholder="yyyy-MM-dd"/>
原因是AngularJs 的ngModel是引用绑定,而不是值绑定,那就意味着如果ngModel对应的引用对象没有变,但是引用对象的值发生了改变的话,Angular是检测不到变化的,因此不会做双向更新。
对应的纠正方法就是,将日期作为变量的属性绑定到date类型的input标签,如下:
$scope.testDate = {
value: new Date();
}
<input type="date" name="testDate" ng-model="testDate.value" placeholder="yyyy-MM-dd"/>
AngularJs 中ngModel绑定HTML5 date数据同步问题的更多相关文章
- angularJS中directive父子组件的数据交互
angularJS中directive父子组件的数据交互 1. 使用共享 scope 的时候,可以直接从父 scope 中共享属性.使用隔离 scope 的时候,无法从父 scope 中共享属性.在 ...
- AngularJS中使用$http对MongoLab数据表进行增删改查
本篇体验使用AngularJS中的$http对MongoLab数据表进行增删改查. 主页面: <button ng-click="loadCourse()">Load ...
- 后端接收不到AngularJs中$http.post发送的数据的问题
1.问题: 后端接收不到AngularJs中$http.post发送的数据,总是显示为null 示例代码: $http.post(/admin/KeyValue/GetListByPage, { pa ...
- 解析angularjs中的绑定策略
一.首先回顾一下有哪些绑定策略? 看这个实在是有点抽象了,我们来看具体的实例分析吧! 二.简单的Demo实例 @绑定:传递一个字符串作为属性的值.比如 str : ‘@string’ 控制器中代码部分 ...
- angularjs中的绑定策略“@”,“=”,“&”实例
<!DOCTYPE html> <html lang="zh-CN" ng-app="app"> <head> <me ...
- angularJs中ngModel的坑
angular中指令被用的最多的除了ng-repeat之外就非他莫属了吧,由于各种业务的需求,我们经常需要去写一些继承ngModel的指令,来满足各种奇葩需求,最多的莫过于表单的验证啦,另外你在封装一 ...
- vuex 实现vue中多个组件之间数据同步以及数据共享。
http://pan.baidu.com/s/1hrJfpli demo下载地址 前言 在一些项目中有很多数据状态之间要实现数据共享状态共享,例如购物车的数据.用户的登录状态等等.vue父元素是可以 ...
- AngularJS 中ng-model通过$watch动态取值
这个例子的意思是,当xxxx的长度不超过6时,xxxx和yyyy两个input的model是无关的,但当xxxx超过6,则yyyy会跟随其值而变化. 另一种做法是在input的ng-model后面添加 ...
- AngularJS 中的作用域
问题引入 使用 Angular 进行过一段时间的开发后,基本上都会遇到一个这样的坑: 123456789101112 <div ng-controller="TestCtrl" ...
随机推荐
- Windbg 大改版,值得期待
早上从twitter上面看到一篇文章,看到windbg会提供一个Time Travel Debugging(TTD) 功能,该功能会在未来的版本引入. Time travel debugging: I ...
- CTF -bugku-misc(持续更新直到全部刷完)
1.签到题 点开可见.(这题就不浪费键盘了) CTF- 2.这是一张单纯的图片 图片保存到本地,老规矩,winhex看一看 拉到最后发现 因为做过ctf新手的密码 所以一看就知道unicode 百度站 ...
- 算概率(dp,数论)
链接:https://ac.nowcoder.com/acm/contest/3003/C来源:牛客网 题目描述 牛牛刚刚考完了期末,尽管牛牛做答了所有 n 道题目,但他不知道有多少题是正确的. 不过 ...
- 「不会」Min25筛
大概的思路是把所有数分成质数和合数考虑 对于质数,必须找出一个很简单的完全积性函数和所求函数拟合 把所有数当做质数看待求个前缀和,然后再枚举合数的最小质因子把合数T掉 枚举到根号n,即可保证把n以内的 ...
- NOIp2018解题报告
D1: T1 \(Ans = \sum_{i=2}^{n} |a_{i}-a_{i-1}|\),正确性可由贪心证得 T2 考虑贪心,选出一个属于A的集合,容易证明其是最优的 然后考虑一个数如果不被选, ...
- python+Sqlite+Dataframe打造金融股票数据结构
5. 本地数据库 很简单的用本地Sqlite查找股票数据. DataSource类,返回的是Dataframe物件.这个Dataframe物件,在之后的业务,如计算股票指标,还需要特别处理. impo ...
- EL表达式和JSTL(二)——BeanUtils工具
BeanUtils工具 大对数人习惯使用JavaBean的get和set方法来获取和设置JavaBean的属性,但是在Java EE编程的过程中,会经常从配置文件中读取数据,但是从配置文件中读取的数据 ...
- java反射使用详细例子
1. 概念 反射,一种计算机处理方式.是程序可以访问.检测和修改它本身状态或行为的一种能力. 2. 反射机制的作用 通过反机制访问java类的属性,方法,构造方法等: 3.反射机制中的类 (1) ja ...
- java8的lambda过滤list遍历集合,排序
1.根据属性过滤list List<AllManagerBean> testLists = broadCastRoomMapper.allManagerlist(); List<Al ...
- 【hdu6613】Squrirrel 树形DP
题意:给一个带权树,求把一条边的权值变成0,再选一个点做根,最大深度最小是多少. \(\sum n \le 10^6\) key:树形DP 题里有边权小于等于200,然而并没有什么用. 首先做出 \( ...