解决angularJS1里面的date-piker日期选择控件，选择完日期组件不消失问题

angular已经是7+的版本了，现在写angular1确实心累，参考文档少，全靠摸索

项目中引用的日期插件为

<div class="form-group" style="padding-left: 10px;">
  <label for="startDate">开始日期</label>
  <input id="startDate" class="form-control" date-time="" view="date" min-view="date" ng-model="searchForm.startDate" format='YYYY-MM-DD'
                        readOnly>
</div>

引用的js库为angular-datepicker.min.js或者angular-datepicker.js，可以先看下项目中具体引用的是哪个js库，如果是min.js的话看下代码具体有没有被压缩，由于是半路接手，这边项目引用的min.js并不是压缩过的。

原理

日期控件是通过date来控制日期的值，所以要想在选择完日期之后隐藏迪掉日期控件，就要找到date的值改变的时候把控件hidden。接下来就是看源码部分了，找到setDate这个方法，在里面加入element.addClass(‘hidden’);scope.$emit(‘hidePicker’);这两行代码即可。

setDate = function(date) {
          if (date) {
            scope.model = date;
            if (ngModel) {
              ngModel.$setViewValue(date);
              element.addClass('hidden');
              scope.$emit('hidePicker');
            }
          }
          scope.$emit('setDate', scope.model, scope.view);

          //This is duplicated in the new functionality.
          if (scope.callbackOnSetDate) {
            scope.callbackOnSetDate(attrs.datePicker, scope.date);
          }
        };

如有问题请联系我~

欢迎加入QQ群: