win-pivot : What is the right way to use the on-selection-changed event?

[frenchyjef]

Hi,

I am trying to figure out the proper way to use the on-selection-changed event of the win-pivot control. My use case is every time a pivot item is selected, I would like the on-selection-changed event to be triggered so I can execute some angular code.

In the below example, the changePivotView() function is triggered during initialization of the page and when a user clicks on a different pivot item. However, the $scope variables "selectedPivotItem" and "selectedPivotIndex" are never updated with the pivot item that is selected (the console.log always displays "null" and "2" respectively).

Any guidance?

This is the HTML code:

<win-pivot on-selection-changed="changePivotView()" selected-item="selectedPivotItem" selected-index="selectedPivotIndex">
    <win-pivot-item header="'First'"></win-pivot-item>
    <win-pivot-item header="'Second'"></win-pivot-item>
    <win-pivot-item header="'Last'"></win-pivot-item>
</win-pivot>

This is my angular code:

$scope.selectedPivotItem = null;
$scope.selectedPivotIndex = 2;

$scope.changePivotView = function changePivotView() {
     console.log($scope.selectedPivotItem);
     console.log($scope.selectedPivotIndex);
};

Thanks, J-F