POST 成功后 AngularJS HTML 不更新

Question

我试图在成功的帖子查询后更新 HTML 中的项目，但我似乎无法让它工作。这是 HTML 端:

<div class='container' ng-controller='MainController as inputControl' >
    <div class='row well well-sm'>

         <div class='col-md-6'>

            <h2>Input Parameters</h2>

            <form name='addform'  ng-submit='inputControl.mainAddition()'>
                 <label>Number 1:</label>
                 <input ng-model='inputControl.inputData.num1' type="number" />
                     <br>
                 <label>Number 2:</label>
                 <input ng-model='inputControl.inputData.num2' type="number" />
                    <br>
                 <input type='submit' value='Add them!'/>
            </form>

         </div>

        <div class='col-md-6'>
            <h2>Result</h2>
            <P>{{inputControl.resultData}}</P>
        </div>

    </div>
</div>

这是 Angular 方面:

angular.module('pageLoader')
    .controller('MainController',['$scope', '$http',  function($scope, $http) {
       var controller = this;
       this.inputData = {};
        $scope.resultData = 0;

       this.mainAddition = (function() {
           console.log(this.inputData);
           $http({
               method: 'POST', 
               url: '/functions', 
               data: this.inputData
           })
           .success( function(data, status, headers, config){
               console.log(data);
               $scope.resultData= (data);
           });
           this.inputData = {};

       });
    }]);

控制台日志显示来自服务器的正确响应，但未填充 HTML 格式的结果数据。

编辑:

是的，抱歉，我完全混淆了 $scope 和这个。找到下面的工作代码

angular.module('pageLoader')
    .controller('MainController',['$scope', '$http',  function($scope, $http) {

       this.inputData = {};
       this.resultData = 0;

       this.mainAddition = (function() {
           var cntrlCache = this;
           console.log(this.inputData);
           $http({
               method: 'POST', 
               url: '/functions', 
               data: this.inputData
           })
           .success( function(data, status, headers, config){
               console.log(data);
               cntrlCache.resultData= data;
           });
           this.inputData = {};

       });
    }]);

Answer 1

更正代码段的最简单方法是将 $scope 更改为 controller in

$scope.resultData= (data);

因为您已经在开头声明了 var controller = this。