Angular Js：没有反映在Scope中更改数组的更改？

Question

我正在尝试调用角度函数，而我将列表放入另一个列表中。功能运行良好，更改反映在控制台上很好，但它没有在html代码中反映在控制器屏幕上。

以下是我的代码。

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'));
}