调用angularjs控制器方法后模板不更新。

10 浏览
0 Comments

调用angularjs控制器方法后模板不更新。

在使用控制器方法进行搜索后，我无法更新模板。

我有一个控制器，它可以将数据列出到模板中，如果没有进行搜索的话，是正确的。数据是从一个服务中检索出来的。

当我按月份和来源进行搜索时，在调用搜索方法后在console.log中的结果是正确的数据，但是HTML模板没有显示这些数据，它显示了未过滤的数据。

我尝试返回$scope.data，或者使用$scope.apply，但都没有起作用。

如何使用过滤后的数据更新模板？

具有搜索方法的控制器：

.controller('AcpCtrl', function($scope, ApiAcpFactory, $ionicLoading, $timeout, $http) {  
  $scope.data = null;
  $ionicLoading.show({noBackdrop: true,template: '搜索中...'});
  ApiAcpFactory.getApiData()
    .then(function(result) {      
        var acp = {};
        acp.resultdata = [ result ];      
        $scope.data = acp.resultdata;      
        $ionicLoading.hide();
   })
   $scope.search = function(data) {
        $scope.data = null;
        $scope.formData = {};
        $scope.formData.month = data.month;
        $scope.formData.origin  = data.origin;
        $ionicLoading.show({noBackdrop: false,template: '搜索中'});        
        ApiAcpFactory.getApiData($scope.formData)
        .then(function(result) {             
            $scope.data = JSON.stringify(result);
            console.log(' scope.data '+$scope.data);      
            $ionicLoading.hide();
       })
        return $scope.data;
    }
})

工厂：

.factory('ApiAcpFactory', function($http, $q, ApiAcpEndpoint) { 
  var getApiData = function(data) {    
    var q = $q.defer();    
    $http.post(ApiAcpEndpoint.url,data)
    .success(function(data) {
        q.resolve(data);
    })
    .error(function(error){
        console.log('发生错误'+error)
        q.reject(error);
    })
    return q.promise;
  }
  return {
    getApiData: getApiData    
  };
})

0