2017-05-09 9 views
0

角度のマテリアルからanglejのdatepickerディレクティブを使用して、日付を入力するためのカレンダーを作成しています。日付がクリックされたときにAngularJS DatePickerが値を更新しない

HTML

<md-datepicker ng-model='vm.endtoDate'></md-datepicker> 

私が直面しています問題は、私は、カレンダー上の任意の日付をクリックすると、それは更新されませんということです。

私は後で時間的検索のために別の変数に値を格納するよう変更された値を監視するためのウォッチ機能を使用したくないJS

function SearchController($scope,$stateParams, $q, $log, httpRequests, $location, searchResults, header, icons,leafletData){ 
     var coordinates_selected; 
     var vm = this; 
     vm.endtoDate = new Date(); 
     var endto= console.log(JSON.stringify(vm.endtoDate,'end')); 

P.S。 uは私はあなたが日付ピッカーにして変更イベントのために行くとすることにより、その店舗に変更された日付を使用して、あなたがしたい場所今までそれを使用することをお勧めウォッチャーまたは何か他のものをたくない場合は

+0

コンソールにエラー?それは –

+0

@SaEChowdaryいないが、私は「保存しようとするとendtoDate uが質問に示したもので動作します'別の変数に、それはまだ私に前の日付を示す – Rehan

+0

どのようにその別の変数に変更された日付を渡して? –

答えて

0

angular.module('datepickerBasicUsage', ['ngMaterial']) 
 
.controller('AppCtrl', function ($scope) { 
 
$scope.endtoDate = new Date(); 
 
$scope.selecteddate=function(){ 
 
var endto= $scope.endtoDate; 
 
console.log(endto); 
 
} 
 
});
<!doctype html> 
 
<html ng-app="datepickerBasicUsage"> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.js"></script> 
 
    <script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/assets-cache.js"></script> 
 
    
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.css"> 
 
    
 
    <script src="app.js"></script> 
 
    </head> 
 
    <body> 
 

 
    <div ng-controller="AppCtrl" > 
 
    
 
    
 
     <md-datepicker ng-model="endtoDate" ng-change="selecteddate()"></md-datepicker> 
 
     
 
     
 
    
 
    
 
    
 
    </div> 
 
    </body> 
 
</html>

0

angular.module('datepickerBasicUsage', ['ngMaterial']) 
 
.controller('AppCtrl', function ($scope) { 
 
$scope.endtoDate = new Date(); 
 
$scope.selecteddate=function(){ 
 
var endto= $scope.endtoDate; 
 
console.log(endto); 
 
} 
 
});
<!doctype html> 
 
<html ng-app="datepickerBasicUsage"> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.js"></script> 
 
    <script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/assets-cache.js"></script> 
 
    
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.css"> 
 
    
 
    <script src="app.js"></script> 
 
    </head> 
 
    <body> 
 

 
    <div ng-controller="AppCtrl" > 
 
    
 
    
 
     <md-datepicker ng-model="endtoDate" ng-change="selecteddate()"></md-datepicker> 
 
     
 
     
 
    
 
    
 
    
 
    </div> 
 
    </body> 
 
</html>

関連する問題