當第二次選擇時，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值沒有變化

回答

相關問題