AngularJS和Canvas沒有響應變化

我正在創建一個AngularJS 1.6原型，並且對於我創建的一個組件，我需要使用代表數據模型的HTML5 Canvas，這是一個玩家數組。AngularJS和Canvas沒有響應變化

我已經能夠使它像一個視頻遊戲一樣工作（循環更新和繪製調用），它能正常工作，但今天我想用ng-repeat顯示畫布旁邊的玩家列表，它確實不行。

通過測試，我做了似乎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; 
}

來源

2017-03-16 Theck

好的，我發現什麼是錯的。這是BASIC，但因爲這個原因，我沒有看到它。

看到這個：$ctrl.field.addEventListener("mousedown", $ctrl.mousedown, false);

這就是問題所在，我已經加入到canvas元素ng-mousedown="$ctrl.mousedown($event)"，它的工作如預期。

來源

2017-03-18 11:36:19 Theck

AngularJS和Canvas沒有響應變化

回答

相關問題