Angular Js: Changes not reflecting on changing array in Scope?

I am trying to call angular function while i am dropping a list into another list. Function is running fine and changes are reflecting on console very well, But it does not reflecting on controller screen in html code.

Here is my code below.

HTML

<div class="info-box" id="lkj" ng-app="sportlyApp" ng-controller="FictureCtrl">

<div ng-repeat="(key, data) in fixture">
                                <div id="round-{{key+1}}">
                                    <div class="rounddiv">Round -{{key+1}}</div>

                                    <ul class="ulround" ng-repeat="x in data">
                                        <li> 
                                            <ul> 
                                                <li id="{{x.teamA}}" draggable="true" ondragstart="drag(event,this)" ondrop="drop(event,this)" ondragover="allowDrop(event)">team-{{x.teamA}}</li> 
                                                <li id="{{x.teamB}}" draggable="true" ondragstart="drag(event,this)" ondrop="drop(event,this)" ondragover="allowDrop(event)">team-{{x.teamB}}</li> 
                                            </ul> 
                                        </li> 
                                    </ul>
                                </div>
                            </div>
                            <span id="drag1" draggable="true" ondragstart="drag(event)" class="btn btn-default">So you think you can drag</span>

                            <div id="div1" class="well" ondrop="drop(event)" ondragover="allowDrop(event)">

                            </div>

SCRIPT

var myApp = angular.module("sportlyApp", []);

myApp.controller('FictureCtrl', function($scope) {

$scope.fixture = [];


var newAr = Array();
for (i=0; i<6; i++){
    newAr[i] = i+1;
}


var gan = Array();

for (k=0; k<5; k++){
    var obj = Array();

    for(i=0,j=5; i<3; i++, j--){

        var jj = {'teamA' : newAr[i],'teamB' : newAr[j]};
        obj.push(jj);
    }
    gan[k] = obj;
    move_array_element(newAr);
}

$scope.fixture = gan;

$scope.swapItem = function (replacerid, replaceeid) {

    var newAr = Array();

    for (i=0; i<6; i++) {
        newAr[i] = i+1;
    }

    temp = newAr[replacerid-1];
    newAr[replacerid-1] = newAr[replaceeid-1];
    newAr[replaceeid-1] = temp;

    // console.log(newAr);

    var gan = Array();

    for (k=0; k<5; k++) {
        var obj = Array();

        for(i=0,j=5; i<3; i++, j--) {

            var jj = {'teamA' : newAr[i], 'teamB' : newAr[j]};
            obj.push(jj);
        }

        gan[k] = obj;
        move_array_element(newAr);
    }

    $scope.fixture = gan;
    console.log(gan);


}

});

function move_array_element(ar){
    var temb = ar[1];

for (i = 2; i < ar.length; i++) {
    ar[i-1] = ar[i];
}



ar[i-1] = temb;
    return ar;
}

function drop(ev,element) {
    ev.preventDefault();

var teamId = ev.dataTransfer.getData("teamid");
var round = ev.dataTransfer.getData("round");

// console.log(teamId+'-'+round);

var dropRound = $(element).parent().parent().parent().parent().attr('id');
var dropTeamId = $(element).attr('id');

angular.element(document.getElementById('lkj')).scope().swapItem(teamId, dropTeamId);

//swapItem(teamId, dropTeamId);

// console.log(dropRound+'-'+dropTeamId);
// ev.target.append(document.getElementById(dropTeamId));
}

function allowDrop(ev) {
    ev.preventDefault();
}

function drag(ev,element) {
    ev.dataTransfer.setData("teamid", ev.target.id);
    ev.dataTransfer.setData("round", $(element).parent().parent().parent().parent().attr('id'));
}