Datepickerはコントローラと反応する - ANGULARJS

Question

Hej、 2つの日付を使用し、published_dateに従って適切な記事をレンダリングするフィルタを作成しました。私のdatepickerは日付を選択していますが、適切な記事を表示するためにコントローラに反応しません。しかし、手動で日付を入力すると機能します。 誰かに助言がありますか？ 何か助けていただきありがとうございます！

index.htmlを

<ul class="list-inline"> 
<li> 
    <label>from</label><input type="text" name="S_Date" ng-model="from" id="from-datepicker" class="form-control" /> 
</li> 
<li> 
    <label>till</label><input type="text" name="E_Date" ng-model="to" id="from-datepicker2" class="form-control"/> 
</li> 
</ul> 

<article class="white-panel" ng-repeat="x in results | orderBy: '-published_date' | myfilter : from : to"> 
    <h5><b>{{x.section}}</b></h5> 
    <h4><a ng-href="{{x.url}}" target="_blank">{{x.title}}</a></h4> 
    <h5>{{x.byline}}</h5> 
    <p>{{x.abstract}} 
    <br><br> 
    <i>{{x.published_date | date: 'medium' }}</i> 
    </p> 
</article> 

controller.js

var app = angular.module('myApp', []); 
app.controller('appController', function($scope, $filter) { 
    var url = "https://api.nytimes.com/svc/topstories/v2/home.json"; 
    url += '?' + $.param({ 
     'api-key': "853fc084776f46e29732e71b3f1269ae" 
    }); 
    $.ajax({ 
     url: url, 
     method: 'GET', 
    }).done(function(result) { 
     console.log(result); 
     $scope.$apply(function(){ 
     $scope.results = result.results; 
    }); 
    }).fail(function(err) { 
     throw err; 
    }); 

    $scope.from="2017-05-02"; 
    $scope.to="2017-06-11"; 

}); 

$("#from-datepicker").datepicker({ 
    format: 'yyyy-mm-dd' 
}); 


$("#from-datepicker2").datepicker({ 
    format: 'yyyy-mm-dd' 
}); 

app.filter("myfilter", function() { 
    return function(results, from, to) { 
     return results.filter(function(results){ 
      return results.published_date >= from && results.published_date 
<= to; 
     }); 
    }; 
}); 

Answer 1

`NG-model`ではないので、自動的に

app.directive('datepicker', [function() { 
     return { 
      restrict: 'A', 
      require: 'ngModel', 
      link: function (scope, element, attrs, ngModelCtrl) { 
       $(function() { 
        element.datepicker({ 
         dateFormat: 'mm/dd/yy', 
         onSelect: function (date) { 
          scope.$apply(function() { 
           ngModelCtrl.$setViewValue(date); 
          }); 
         } 
        }); 
       }); 
      } 
     } 
    }]); 

<input type="text" datepicker name="S_Date" ng-model="from" class="form-control" />