在config对象中是我想要在事件上调用的回调. (作品)

在回调中,我想修改控制器的$scope上的属性,这不起作用. Angular不承认该属性由于某种原因而发生了变化,这让我相信回调中的$scope与控制器的$scope不同.我的问题是我不知道为什么.

任何人都能指出我正确的方向吗？

Click here for Fiddle

app.js

var app = angular.module('app',[])
    .directive('datepicker',function () {
        return {
            restrict: 'A',link: function (scope,element,attrs) {
                // Uncommenting the line below causes
                // the "date changed!" text to appear,// as I expect it would.
                // scope.dateChanged = true;

                var dateInput = angular.element('.datepicker')

                dateInput.datepicker(scope.datepickerOpts);

                // The datepicker fires a changeDate event
                // when a date is chosen. I want to execute the
                // callback defined in a controller.
                // ---
                // PROBLEM: 
                // Angular does not recognize that $scope.dateChanged
                // is changed in the callback. The view does not update.
                dateInput.bind('changeDate',scope.onDateChange);
            }
        };
    });

var myModule = angular.module('myModule',['app'])
    .controller('MyCtrl',['$scope',function ($scope) {
        $scope.dateChanged = false;

        $scope.datepickerOpts = {
            autoclose: true,format: 'mm-dd-yyyy'
        };

        $scope.onDateChange = function () {
            alert('onDateChange called!');

            // ------------------
            // PROBLEM AREA:
            // This doesnt cause the "date changed!" text to show.
            // ------------------
            $scope.dateChanged = true;

            setTimeout(function () {
                $scope.dateChanged = false;
            },5000);
        };
    }]);

HTML

<div ng-controller="MyCtrl">
    <p ng-show="dateChanged">date changed!</p>
    <input type="text" value="02-16-2012" class="datepicker" datepicker="">
</div>