Why binding doesn't work in angularjs

Question

I have Kendo UI Calendar with Angularjs and everytime i select a date i call the "onChangeData" function:

<div kendo-calendar="cal1" k-options="thingsOptions" k-rebind="events" ></div>

And in the AngularJs controller:

var onChangeData = function()
{
    var value = this.value();
    $scope.scopeTest = "Test";
}

$scope.thingsOptions = {
    value: today,
    change: onChangeData,
    dates: $scope.events,
    month: {
        content: $("#redDays").html(),
        empty: "X"
    }
};

In the html page i have:

<h4 class="form-control-static text-info">{{scopeTest}}</h4>

Why when i select a date and the function onChangeData is called, the scopeTest isn't binded in the view html page? What's wrong?

Thanks

Answer 1

I think the problem is kendo calendar calls the change handler out side of the angular digest cycle... angular watches does not react to changes made outside the digest cycle till the next cycle... so the solution can be to manually call the $apply() method of $scope

var onChangeData = function () {
    var value = this.value();
    $scope.scopeTest = "Test";
    $scope.$apply()
}