javascript - angularjs daterangepickerがngmodelに入力されていません

Question

http://www.daterangepicker.com/を angularjsで使用しようとしていますが、ngModel の値を更新できません。次のディレクティブを作成しましたが、scope.ngModel が常に未定義である理由を教えてください。

angular.module('daterangepickerDirective', [])
.directive('daterangepicker', function() {

    return {
        restrict: 'A',
        scope: {
            ngModel: '='
        },          
        link: function( scope, element, attrs ) {
            console.log('scope.ngModel') // UNDEFINED. Why?
            // Date range picker
            element.daterangepicker({
                locale: {
                    format: 'YYYY-MM-DD',
                    showDropdowns: true
                },
                ranges: {
                   'All Time': ['1900-01-01', moment()],
                   'Today': [moment(), moment()],
                   'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                   'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                   'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                   'This Month': [moment().startOf('month'), moment().endOf('month')],
                   'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                }                   
            }).on("apply.daterangepicker",function(event){
                scope.$apply(function() {
                   scope.ngModel.$setViewValue(event.date);//This will update the model property bound to your ng-model whenever the datepicker's date changes.
                });
            });             
        }
    }
});

私のHTMLは単純です

<input type="text" daterangepicker class="form-control" ng-model="selected_filters.date" />

どうもありがとう。