2015-03-25 23 views
1
app.controller('FilterController', ['$scope', '$http', 
function($scope,$http) { 

    //Loading the data to the filter scope 
    $http.get('/main').success(function(response){ 
     $scope.data = response; 
    }); 

    //The object that the input fields in the modal bind to 
    $scope.selected = {}; 

    this.applyFilter = function(){ 
     $http.post('/main/query', $scope.selected).success(function(response){ 
      //The response is the filtered object sent by the server 
      console.log(response); //This is the response I want to bind to the main view 

      //Do something to pass the response to the main scope 

     }); 
    }; 
}]); 

該模式包含一些下拉菜單,供用戶選擇參數,並將這些參數保存到'selected'變量中,然後發送到數據庫以查詢一組新數據。 現在面臨的挑戰是將這些新數據發送到主範圍並刷新頁面。我做了一些研究,發現它似乎可以通過解決方案來完成,但我不確定如何將代碼放在一起。請幫助..如何將我從模態獲得的數據發送到主視圖?

回答

0

由於您用angular-ui標記了問題,我假設您使用的是模塊的ui.bootstrap。

首先將ui.bootstrap注入您的應用程序。

在你的主控制器打開模式:

app.controller('MainController', ['$scope', '$modal', 
function($scope,$modal) { 
    $scope.filterModal = $modal.open({ 
     templateUrl: 'modal.html', 
     controller: 'FilterController', 
     size: 'md' 
    }); 
    $scope.filterModal.result.then(function (result) { 
     // do what you have to with result from modal 
    }); 
}]); 

你的模式必須有一個控制器:

app.controller('FilterController', ['$scope', '$http','$modalInstance', 
function($scope,$http, $modalInstance) { 

    //Loading the data to the filter scope 
    $http.get('/main').success(function(response){ 
     $scope.data = response; 
    }); 

    //The object that the input fields in the modal bind to 
    $scope.selected = {}; 

    this.applyFilter = function(){ 
     $http.post('/main/query', $scope.selected).success(function(response){ 
      //The response is the filtered object sent by the server 
      console.log(response); //This is the response I want to bind to the main view 

      //Do something to pass the response to the main scope 
      $modalInstance.close(response); 
     }); 
    }; 
}]); 
+0

回去再學習的榜樣,最終實現它是$ modalInstance.close ()方法,這是做魔術,謝謝你! – user2901633 2015-03-26 06:49:14

0

您應該可以通過將$ scope.data分配給響應來完成。

this.applyFilter = function(){ 
     $http.post('/main/query', $scope.selected).success(function(response){ 
      //The response is the filtered object sent by the server 
      console.log(response); //This is the response I want to bind to the main view 

      // Binding the response 
      $scope.data = response; 

      //Do something to pass the response to the main scope 

     }); 
    }; 
相關問題