当第二次选择时，angularjs bootstrap datepicker值没有变化

目前我正在为datepicker for angularjs这是按预期工作。但是，当我试图从datepicker第二次选择值时，值没有变化。以下是代码片段到目前为止，我已经试过： -当第二次选择时，angularjs bootstrap datepicker值没有变化

HTML

<div id="dvFromDate" class='input-group date' datetimepicker ng-model="FromDate"> 
            <input type="text" ng-model="FromDate" class="form-control" @*tooltips tooltip-template="dd/mm/yyyy"*@ required> 
            <span class="input-group-addon"> 
             <span class="glyphicon glyphicon-calendar"></span> 
            </span> 
           </div> 
           <script type="text/javascript"> 
            $(function() { 
             $('#dvFromDate').datetimepicker({ 
              format: 'DD/MM/YYYY' 
             }); 
            }); 

           </script>

AngularJs

app.directive('datetimepicker', function() { 
    return { 
     require: '?ngModel', 
     restrict: 'A', 
     link: function (scope, element, attrs, ngModel) { 
      if (!ngModel) return; // do nothing if no ng-model 
      ngModel.$render = function() { 
       element.find('input').val(ngModel.$viewValue || ''); 
      }  

      element.on('dp.change', function() { 
       scope.$apply(read); 
      }); 

      read(); 

      function read() { 
       var value = element.find('input').val(); 
       ngModel.$setViewValue(value); 
      } 
     } 
    } 
});

我也设置日期选择器值清空字符串在selectionchanged事件的选择下拉类似如下： -

$scope.FromDate = ''; 
$scope.ToDate = '';

下拉列表值设置为空字符串后，每当我从日期选择器选择任何价值，价值也越来越空。任何形式的帮助，将不胜感激。

来源

2017-02-14 Priom Biswas

您能创建一个小提琴吗？ – Sravan

请创建小提琴 –

请参阅小提琴： - [角度助推器日期选择器]（https://plnkr.co/edit/o3UvmjFKqUhZWihh1f84?p=preview） –

如果您在plnkr看控制台，你会看到jQuery是不正确加载.......

看到这个plnkr。它不完美，但会给你一个开始！

https://plnkr.co/edit/oyBF62NkNS3sMwumxk7F?p=preview

var app = angular.module('plunker', []); 

app.controller('MainCtrl', function($scope) { 
$scope.model = {}; 
    $scope.model.FromDate1 = "5/5/2016"; 

}); 
app.directive('datetimepicker', function($timeout) { 
    return { 
    restrict: 'A', 
    scope: { }, 
    link: function (scope, element, attrs) { 
     angular.element(element).datepicker({ 
      format: 'DD/MM/YYYY', 
      onClose: function(dateText, inst){ 
      $timeout(function(){scope.$parent.model.FromDate1 = dateText}); 
      console.log(scope.$parent.model.FromDate1); 
      console.log(dateText); 
      } 
     }); 
    } 
    } 
});

HTML

<body ng-controller="MainCtrl"> 
    <h3>AngularJs Date Picker</h3> 
    <div class="col-xs-5"> 
     <div class="form-group"> 
     <label>From Date</label> 
      <input type="text" class="form-control" id="dp1" datetimepicker /> 
     </div> 
     <div>From Date<input type="text" ng-model="model.FromDate1"/></div> 
    </div> 
    </body>

来源

2017-02-14 07:14:38 garethb

更新后的定位器：[已更新的定位器]（https://plnkr.co/edit/o3UvmjFKqUhZWihh1f84?p =预览）1.选择一个日期，你可以看到输入框中的值2.点击重置按钮3.再次选择之前选择的同一日期问题是这次你看不到该值。以下是更新的重新启动 –

dp。只有在更改日期值时更改才会触发，选择相同日期不会更改存储在选取器中的值。您应该使用dp.hide事件。 – garethb

这是正确的，你是对的。 –

在引导-datepicker.js文件，我已经注释掉从以下方法行：

notifyEvent = function (e) { 
      //if (e.type === 'dp.change' && ((e.date && e.date.isSame(e.oldDate)) || (!e.date && !e.oldDate))) { 
      // return; 
      //}    
      element.trigger(e); 
     },

，现在每当我再次选择相同的日期，价值绑定工作正常。请参阅更新的重新启动程序： Working plunker

来源

2017-02-15 04:05:07

当第二次选择时，angularjs bootstrap datepicker值没有变化

回答

相关问题