Javascript AngularJS和Canvas不响应更改

我正在创建一个AngularJS 1.6原型，对于我正在创建的一个组件，我需要使用一个HTML5画布来表示数据模型，一个播放器数组

我已经能够使它像一个视频游戏一样工作（循环更新和绘制调用），它工作正常，但今天我想在画布旁边显示一个玩家列表，并重复ng，但它不工作

通过我所做的测试，AngularJS似乎没有意识到数组中的推送，并且它不会刷新DOM，因为如果我在应用程序中执行其他更改DOM的操作，那么列表就会出现。我做错了什么

function TaggingPlaySituationController() {
    this.$onInit = function () {
        $ctrl.field.addEventListener("mousedown", $ctrl.mousedown, false);

        window.requestAnimationFrame($ctrl.loop);
    }

    this.mousedown = function (evt) {
        player = new Player($ctrl.resourceManager, $ctrl.mouse.x, $ctrl.mouse.y, Math.ceil(Math.random() * 10));
        $ctrl.players.push(player);
    }

    this.loop = function () {
        var now = Date.now();
        var dt = now - $ctrl.lastUpdate;

        $ctrl.lastUpdate = now;

        $ctrl.update(dt);
        $ctrl.draw();
        window.requestAnimationFrame($ctrl.loop);
    };
}

function CanvasObject(resourceManager, x, y, width, heigth) {
    this.resourceManager = resourceManager;
    this.x = x;
    this.y = y;
}

function Player(resourceManager, x, y, dorsal) {
    CanvasObject.call(this, resourceManager, x, y, 18, 18);
    this.dorsal = dorsal;
}
Player.prototype = new CanvasObject;
}

---

好的，我已经找到了问题所在。这是基本的，但出于这个原因，我没有看到它

请参见：

$ctrl.field.addEventListener（“mousedown”，$ctrl.mousedown，false）

这就是问题所在，我已经添加到canvas元素
ng mousedown=“$ctrl.mousedown（$event）”
中，它按照预期工作