Kendo UI AngularJS Pie Chart seriesClick function does not change variables

Question

In KendoUI AngularJS demo, telerik shows a seriesHover action that I thought was pretty cool.

I needed an onClick action rather than hover over, thankfully it was as simple as changing the tag from k-series-hover to k-series-click. I got it do show an alert or log a message in console just fine.

But when I tried to change the value of a variable in the same scope, it does not change that variable value.

$scope.hello = "hope";
$scope.onSeriesClick = function(e) {
     kendoConsole.log(kendo.format("event :: seriesHover ({0} : {1})", e.category, e.value));
     $scope.hello = e.category;
 };

In fact, there is some really weird behavior:

1. Click the pie chart, console log gets updated. $scope.hello is not changed.
2. Click the button on the same scope, $scope.hello gets updated to the last clicked pie slice.

I can't really describe it well, so here is the demo: http://dojo.telerik.com/UTOnO/3

Is this a scope issue??? Or something else?

Answer 1

Not sure whether it's considered a bug, but you can fix it by using $apply:

$scope.$apply(function(){
    $scope.hello = e.category;
});