Javascript ajax post请求后作用域变量未更改

我在做一个雅思水疗。这是我的js文件

var game = angular.module('yahtzee',[]);

game.controller('RollDicesController', function($scope, $http) {
  $scope.img1 = "style/img/dice1.jpg";
  $scope.img2 = "style/img/dice2.jpg";
  $scope.img3 = "style/img/dice3.jpg";
  $scope.img4 = "style/img/dice4.jpg";
  $scope.img5 = "style/img/dice5.jpg"; 

 $scope.result = {
     Ones : '0',
     Twos : '0',
     Threes : '0',
     Fours : '0',
     Fives : '0',
     Sixes : '0',
     ThreeOfAKind : '0',
     FourOfAKind : '0',
     FullHouse : '0',
     SmallStraight : '0',
     LargeStraight : '0',
     Chance: '0',
     Yahtzee : '0'
 };

 $scope.notSorted = function(obj){
     if (!obj) {
         return [];
     }
     return Object.keys(obj);
 }

 $scope.rollDices = function() {
     $dice1 = Math.floor((Math.random() * 6) + 1);
     $dice2 = Math.floor((Math.random() * 6) + 1);
     $dice3 = Math.floor((Math.random() * 6) + 1);
     $dice4 = Math.floor((Math.random() * 6) + 1);
     $dice5 = Math.floor((Math.random() * 6) + 1);

     $scope.img1 = "style/img/dice" + $dice1 + ".jpg";
     $scope.img2 = "style/img/dice" + $dice2 + ".jpg";
     $scope.img3 = "style/img/dice" + $dice3 + ".jpg";
     $scope.img4 = "style/img/dice" + $dice4 + ".jpg";
     $scope.img5 = "style/img/dice" + $dice5 + ".jpg";

     $http.post('calculate', {'dice1': $dice1, 'dice2': $dice2, 'dice3': $dice3, 'dice4': $dice4, 'dice5': $dice5 }).success(function(data) {
         $scope.result = data;
     }).error(function(data, status) { 
         $scope.errors.push(status);
     });

  };

});

请求所做的几乎是相应移动的属性值。我有一个php控制器连接到

calculate

route（我使用的是Laravel），它完成了所有的数学工作。 现在的问题是，尽管我正确地接收到了值（我已经测试过了），但我的表没有更新

我的网页中已经有一个定义了控制器的主div：

<div ng-controller="RollDicesController">
    <div id="game_div">
        <div id="dice_div">
            <ul>
              <li style="list-style-type: none;" class="listaDados"  >
               <img id="dice1" ng-src="{{img1}}">
               <img id="dice2" ng-src="{{img2}}" > 
               <img id="dice3" ng-src="{{img3}}" > 
               <img id="dice4" ng-src="{{img4}}" >
               <img id="dice5" ng-src="{{img5}}" > 
              </li>
            </ul>
            <a>  
                <button id="rolldice_button" class= "button_class" ng-click="rollDices()">
                    Roll Dice!
                </button>
            </a>  
    <div id="table_div">
        <table id="score_table" border="1" >
            <tr ng-repeat="key in notSorted(result) track by $index" ng-init="val = result[key]">
                <td> {{ key }} </td>
                <td> {{ val }} </td>
            </tr>
        </table>
    </div>
</div>

我按下按钮，它工作了一次，而下面的点击并没有改变桌子。 由于某种原因，在我给

$scope.result

一个值之后，它的值再也不会改变。由于我对AngularJS的了解有限，我不知道为什么会发生这种情况

编辑2：我尝试使用$scope.apply（）更改请求，如下所示

$http.post('calculate', {'dice1': $dice1, 'dice2': $dice2, 'dice3': $dice3, 'dice4': $dice4, 'dice5': $dice5 }).success(function(data) {
            $scope.result = data;
            $scope.apply();
    }).error(function(data, status) { 
        $scope.errors.push(status);
    });

编辑3:

$scope.$apply

在我以前的编辑中写得很糟糕，在更正它之后，它现在向我显示了这个错误

错误：错误：inprog
行动已在进行中
$digest已在进行中

最终编辑：$timeout起作用了，问题是使用了notSorted函数

现在创建的表如下所示：

        <div id="table_div">
        <table id="score_table" border="1" >
            <tr ng-repeat="(key, val) in result track by $index">
                <td> {{ key }} </td>
                <td> {{ val }} </td>
            </tr>
        </table>
    </div>

{{key}}
{{val}}

---

虽然它没有按照我想要的方式排序，但至少它是有效的

试试这个，建议不要使用$apply

注意，我在顶部插入了$timeout

var game = angular.module('yahtzee',[]);

game.controller('RollDicesController', function($scope, $http, $timeout) {
  $scope.img1 = "style/img/dice1.jpg";
  $scope.img2 = "style/img/dice2.jpg";
  $scope.img3 = "style/img/dice3.jpg";
  $scope.img4 = "style/img/dice4.jpg";
  $scope.img5 = "style/img/dice5.jpg"; 

 $scope.result = {
     Ones : '0',
     Twos : '0',
     Threes : '0',
     Fours : '0',
     Fives : '0',
     Sixes : '0',
     ThreeOfAKind : '0',
     FourOfAKind : '0',
     FullHouse : '0',
     SmallStraight : '0',
     LargeStraight : '0',
     Chance: '0',
     Yahtzee : '0'
 };

 $scope.notSorted = function(obj){
     if (!obj) {
         return [];
     }
     return Object.keys(obj);
 }

 $scope.rollDices = function() {
     $dice1 = Math.floor((Math.random() * 6) + 1);
     $dice2 = Math.floor((Math.random() * 6) + 1);
     $dice3 = Math.floor((Math.random() * 6) + 1);
     $dice4 = Math.floor((Math.random() * 6) + 1);
     $dice5 = Math.floor((Math.random() * 6) + 1);

     $scope.img1 = "style/img/dice" + $dice1 + ".jpg";
     $scope.img2 = "style/img/dice" + $dice2 + ".jpg";
     $scope.img3 = "style/img/dice" + $dice3 + ".jpg";
     $scope.img4 = "style/img/dice" + $dice4 + ".jpg";
     $scope.img5 = "style/img/dice" + $dice5 + ".jpg";

     $http.post('calculate', {'dice1': $dice1, 'dice2': $dice2, 'dice3': $dice3, 'dice4': $dice4, 'dice5': $dice5 }).success(function(data) {
         $timeout(function() {
             $scope.result = data;
         });
     }).error(function(data, status) { 
         $scope.errors.push(status);
     });

  };

});

请尝试以下代码：

<div id="table_div">
        <table id="score_table" border="1" >
            <tr ng-repeat="key in result track by $index" ng-init="val = result[key]">
                <td> {{ key }} </td>
                <td> {{ val }} </td>
            </tr>
        </table>
</div>

---

为什么需要

notSorted（）

函数？在ajax调用中使用承诺，并将结果模型附加到repeater@LozCheroneツ 你能举个例子说明怎么做吗？我是个新手AngularJS@LozCheroneツ 我找到了另一种对表进行排序的方法，它说$timeout没有定义。您是否将它注入控制器定义中？请参阅game.controller（'rolldiescocontroller'，function（$scope，$http，$timeout）{。您需要像我在代码中做的那样将它放在那里。哦，对不起，我现在才注意到它。我会这样做。这没有任何意义，我需要notSorted函数才能按我想要的顺序排列数组，然后尝试上面给出的第二个选项。

<div id="table_div">
        <table id="score_table" border="1" >
            <tr ng-repeat="key in result track by $index" ng-init="val = result[key]">
                <td> {{ key }} </td>
                <td> {{ val }} </td>
            </tr>
        </table>
</div>

$http.post('calculate', {'dice1': $dice1, 'dice2': $dice2, 'dice3': $dice3, 'dice4': $dice4, 'dice5': $dice5 }).success(function(data) {
         $timeout(function() {
             $scope.result = data;
         });
     }).error(function(data, status) { 
         $scope.errors.push(status);
     });
$timeout to avoid $digest error.