我需要使用angular和bootstrap创建一个带有日期和时间的输入框。我发现了这个日期时间选择器,它看起来正是我需要的 - 在一个字段中同时包含日期和时间,并阻止用户进行错误的编辑。我编写了一个指令,日期选择器也开始工作了,但它改变了视图而模型并没有改变... 我还尝试了onSelect,但仍然没有任何反应。
<div class="container container-fluid" ng-controller="Ctrl1">
2+2={{2+2}}, var1={{var1}}
<form class="form-horizontal" novalidate name="form" ng-submit="submit()">
<div class="well">
<div id="date" class="input-append" datetimez ng_model="var1">
<input data-format="MM/dd/yyyy HH:mm:ss PP" type="text" id="input1" name="input1" ng_model="var1"></input>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar">
</i>
</span>
</div>
</div>
</form>
</div>
js
var project = angular.module('project',['ui.bootstrap']);
project.directive('datetimez', function() {
return {
restrict: 'A',
require : 'ngModel',
link: function(scope, element, attrs, ngModelCtrl) {
$(function(){
element.datetimepicker({
dateFormat:'dd/MM/yyyy hh:mm:ss',
language: 'pt-BR',
onSelect:function (date) {
//alert('zz');
ngModelCtrl.$setViewValue(date);
scope.$apply();
}
});
});
}
};
});
project.controller('Ctrl1', ['$scope', '$rootScope', function(scope, rootScope){
scope.var1="123";
}]);
如何解决连接问题?