微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

基于angular实现三级联动的生日插件

写了一个生日联动插件具体的效果是这样的:

具体的数据

我取得数据是今年的数据,如果是想要做三级联动的日期插件,改一下时间就好了

Nowyear-lengthYear;i--,j++){ dataPicker.year[j]=i; } for(var i=0;i<=11;i++){ if(i<9){ dataPicker.month[i]='0'+(i+1); }else{ dataPicker.month[i]=String(i+1); } } return dataPicker; } } }])

directive插件的主要内容

rush:js;"> app.directive('selectDatepicker',dataPicker) { return { restrict: 'EAMC',replace: false,scope: { birthday: '=birthday' },transclude: true,template: '生日'+ ''+ ''+ '',link: function (scope,element){ var arr=[]; scope.birthday=scope.birthday=='0000-00-00'?"":scope.birthday var shuju=dataPicker.query() scope.yearall=shuju.year; scope.MonthAll=shuju.month; if(scope.birthday){ scope.birY=scope.birthday.birthday.split('-')[0]; scope.birM=String(scope.birthday.birthday.split('-')[1]) }else{ scope.birY=""; scope.birM=""; } scope.getDaysInOneMonth=function(year,month){ var month1 = Number(month); month1=parseInt(month1,10) var d= new Date(Number(year),month1,0); return d.getDate(); } scope.getDayArr=function(day){ shuju.day=[]; for(var i=0; icope.birthday){ var day=scope.getDaysInOneMonth(scope.birthday.birthday.split('-')[0],scope.birthday.birthday.split('-')[1]); scope.getDayArr(day) scope.DayAll=shuju.day; scope.birD=scope.birthday.birthday.split('-')[2] } scope.changeYear=function(){ scope.birD=""; scope.birM=""; } scope.changeMonth=function(){ var day=scope.getDaysInOneMonth(scope.birY,scope.birM); console.log(day) scope.getDayArr(day); scope.DayAll=shuju.day; scope.birD=""; } scope.changeDay=function(){ scope.returnDate(); } scope.returnDate=function(){ if(!scope.birD||!scope.birY||!scope.birM){ scope.birthday.returnValue=""; }else{ arr[0]=scope.birY; arr[1]=scope.birM; arr[2]=scope.birD; scope.birthday.returnValue=arr.join("-"); } } } } }) });

html

js 传入的数据

rush:js;"> $scope.birthday={ birthday:1993-01-20,returnValue:'',}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

原文地址:https://www.jb51.cc/js/39312.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐