需求描述:在弹出的模态页面上显示计时器
问题描述:模态页面的text框使用了ng-model绑定数据,controller中也使用了间隔调用来实现了计时器的具体逻辑,但是最后出现的问题是使用了间隔调用并且通过检测值发生改变但新值无法渲染到界面上,也就是说模态界面上的数据不能实时更新,而保留在初始化界面时的状态
解决办法:强制获取模态界面中的text框,给text控件定义一个id,通过angular.element(document.getElementById(id))来获取这个text控件对象,既然可以操作这个text的值
/**
* 获取id的代码
*/
var textview= angular.element(document.getElementById('textviewid'));
/**
* 计时器的逻辑(只实现了由秒到分)
*/
function addNum(){
var textview=
angular.element(document.getElementById('textviewid'));
var time=0;
var arr=textview[0].value.split(':');
time=parseInt(arr[1]);
time=time+1;
if(time==60){
var minute=parseInt(arr[0])+1;
minute=minute+"";
if(minute.length<2){
minute=0+minute;
}
arr[1]='00';
textview[0].value=minute+":"+arr[1];
}else{
time=time+"";
if(time.length<2){
time='0'+time;
}
textview[0].value=arr[0]+":"+time;
}
};