如何将从模态获取的数据发送到主视图?

How to send the data I got from modal to the main view?

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' 变量中,该变量又被发送到数据库以查询一组新数据。 现在的挑战是将这个新数据发送到主范围并刷新页面。我做了一些研究,发现它似乎可以通过解决来完成,但我不确定如何将代码放在一起。请帮忙..

您只需将 $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

        });
    };

既然你用 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);
        });
    };
}]);