Кнопка изменения фонового изображения в AngularJS

Question

309/5000 Здравствуйте, Это мой первый пост.Я разрабатываю жестокий TicTacToe с AngularJS.Но я не могу изменить изображения кнопок, когда я нажимаю на нее.Игра еще не закончена, мне нужна помощь только для этого.Извините за английский "MACCHERONICO" (итальянская паста).Спасибо всем.

app.controller('gameController', function ($scope, $routeParams) {
$scope.p1name = $routeParams.p1name;
$scope.p2name = $routeParams.p2name;
$scope.griglia = ['', '', '', '', '', '', '', '', ''];
$scope.player = $scope.p1name;
$scope.turno = 0;
var img_array = ['imm\broccolo-sorridente-alimenti-verdure-1138234.png',
    'imm\pomodoro-sorridente-alimenti-verdure-1130307.png'];
$scope.img;
$scope.riempi = function (a) {
    console.log("entrati in riempi casella " + a);
    if ($scope.turno == 0) {
        $scope.griglia[a - 1] = "x";
    } else {
        $scope.griglia[a - 1] = "o";
    }
    $scope.aggiornaimg();
    $scope.cambiaturno();
};

$scope.cambiaturno = function () {
    console.log("entrati in cambiaturno");
    if ($scope.turno == 0) {
        $scope.turno = 1;
        $scope.player = $scope.p1name;
    } else {
        $scope.turno = 0;
        $scope.player = $scope.p2name;
    }
};
$scope.aggiornaimg = function () {
    console.log("entrati in aggiornaimg");
    for (let index = 0; index < 9; index++) {
        if ($scope.griglia[index] == "x") {
            console.log("entrati in aggiornaimg primo if");       
            document.getElementById("i" + index + 1).currentSrc = img_array[0];
        } else if ($scope.griglia[index] == "o") {
            document.getElementById("i" + index + 1).currentSrc = img_array[1];
        }
    }
};

Мой HTML

        <table >
                    <button type="button" ng-click=(riempi(1))>
                        <img ng-src="{{img}}" id="i1">
                    </button>
                </td>
                <td>
                    <button type="button" ng-click=(riempi(2))>
                        <img src="" id="i2"> </button>
                </td>
               ....
        </table>

Answer 1

Я думаю, что ваша проблема в том, что "i" + index + 1 не приводит к нужному идентификатору:

for (let index = 0; index < 9; index++) {
    console.log("i" + index + 1);
}

Добро пожаловать в красоту JS, что вам нужно:

for (let index = 0; index < 9; index++) {
    console.log("i" + (index + 1));
}

Таким образом, сумма выполняется до объединения.