Question

コントローラの機能を実行する角度ディレクティブに2度問題があります。この回避策があるかどうか、

JS

  app.directive("usertype", function() { 
       return { 
        restrict: 'A', 
        replace: true, 
        template : `<div style='position: absolute;' class='control-group'> 
            <div class="close-i"><i class="material-icons" ng-click="reset()">close</i></div> 
            <div class="preloader" ng-show = "loading && !done"></div> 
            <div class="done" ng-show = "done"><i class="material-icons">done</i><p>Update Successful</p></div> 
            <label class="control control--radio" style="margin-top: 30px" ng-click="updateusertype(user, '1')" ng-show = "!loading"><span>Super User</span> 
             <input type="radio" name="usertype" checked="checked"/> 
             <div class="control__indicator"></div> 
            </label> 
            <label class="control control--radio" ng-click="updateusertype(user, '2')" ng-show = "!loading"><span>Administrator</span> 
             <input type="radio" name="usertype"/> 
             <div class="control__indicator"></div> 
            </label> 
            <label class="control control--radio" ng-click="updateusertype(user, '3')" ng-show = "!loading"><span>Product Specialist</span> 
             <input type="radio" name="usertype"/> 
             <div class="control__indicator"></div> 
            </label> 
           </div> 
        `, 
        controller: function($scope, $http){ 
         $scope.reset = function(){ 
          $scope.loading = false; 
          $scope.done = false; 
          $scope.showuserTypeForm = false; 
         } 

         $scope.updateusertype = function(user, newPost){ 
           $scope.loading = true; 
           var pastPost = user.userType; 
           console.log(pastPost); 
           user.userType = newPost; 
           console.log(pastPost); 
           $http({ 
            url: "../../get1.php", 
            method: "GET", 
            params: user 
           }).then(function(res){ 
             $scope.done = true; 
             console.log(res.data); 
           }, function(err){ 
             console.log(pastPost); 
             user.userType = pastPost; 
           }); 
          } 
         } 
       }; 
      }); 

<td class="text-primary"><span ng-click="showuserTypeForm = !showuserTypeForm">{{user.userType | userType}}</span><div ng-show="showuserTypeForm" usertype></div></td> 

範囲でupdateusertype方法でこの原因競合は、具体的に可変pastPost、私はそれがある前に、user.userTypeに等しくする必要がHTMLいくつかの理由で$ http opが失敗した場合、user.userTypeの値を元に戻すことができます。しかし、関数が2回実行された場合、pastPostは更新されたuser.userTypeと等しくなりました。これは私が期待していないものです。

Answer 1

私のやり方では完全な修正はしていませんが、これは今のところ保留になります。

    $scope.updateusertype = function(user, newPost){ 
          $scope.runOnce = !$scope.runOnce; 
          if($scope.runOnce){ 
           $scope.loading = true; 
           var pastPost = user.userType; 
           console.log(pastPost); 
           user.userType = newPost; 
           console.log(pastPost); 
           $http({ 
            url: "../../get1.php", 
            method: "GET", 
            params: user 
           }).then(function(res){ 
             $scope.done = true; 
             console.log(res.data); 
           }, function(err){ 
             console.log(pastPost); 
             user.userType = pastPost; 
           }); 
          } 
         }