Angularjs的My97DatePicker扩展

对于日期控件来说，My97DatePicker算得上是个优秀的东东了。好几个项目都用的它。

新项目中也是一样，不过区别是使用的Angularjs。二者不会冲突，不过以往情况下使用的 ng-model 在日期表单上无效。（应该算是对事件的处理上二者出现了冲突）

针对这一问题，写了个简单的指令如下

my97NgExtension.js

angular.module('My97Ext', []).directive('datepicker', function () {
    return {
        restrict: 'A',
        require: '?ngModel',
        scope: {},
        link: function (scope, element, attrs, ngModel) {
            if (!ngModel) return;
            element.on("blur",function () {
                var val = this.value;
                scope.$apply(function () {
                    ngModel.$setViewValue(val);
                });
            })
        }
    };
});

应用页面

<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
    <title>AngularJS Datepicker</title>
    <meta charset="utf-8">
    <script src="/WdatePicker.js"></script>
    <script src="/angular.min.js"></script>
    <script src="/My97NgExtension.js"></script>
    <script>
        var app = angular.module('myApp', ['My97Ext']);
        app.controller('MainCtrl', function ($scope) {
            $scope.Deadline = '2015-12-29';
        });
    </script>
</head>
<body  ng-controller="MainCtrl">
    <input id="dt" datepicker class="Wdate" type="text" onclick="WdatePicker()" placeholder="报名截止时间" ng-model="Deadline" />
    <br />
    截止日期：{{Deadline}}
    <hr />
    <input type="text" ng-model="Deadline" />
</body>
</html>

使用时多添加扩展指令，然后在日期表单上添加 datepicker属性即可