如何通过AJAX将选择列表组件的列表传递给AngularJS中的Java控制器？

Question

项目：jsp + AngularJS

我有一个模态，我已经通过POST（ajax）将一些信息传递给Java控制器，它工作正常。

但是，我插入了一个新组件，但我不知道如何接收选择列表组件的选定列表，请查看图像以了解：

例如，我有一些字段通过POST传递给我的java控制器，并且运行良好：

$scope.cadastraCertificado = function() {       

$http.post('/boxmlV2/cadastrocertificado/salvaCertificado', {
    urlCertificado :     $scope.certificadoIncluirAlterar.urlCertificado,
    dataValidadeCertificado : $scope.certificadoIncluirAlterar.dataValidadeCertificado.toString(),
    senhaCertificado : $scope.certificadoIncluirAlterar.senhaCertificado
    //picklist????????          
}).then(function(response) {
    $scope.sucesso();
}, function(response) {         
});

};  

但是我不知道如何从选择列表组件中选择的列表（右侧的列表）接收数据。

我怎样才能做到这一点？

我的选择列表：

                               <div class="form-group">
                                    <label class="control-label col-md-3">Empresas:</label>
                                    <div class="col-md-9">                                          
                                        <select ng-model="corvo" multiple="multiple" class="multi-select" id="my_multi_select1" name="my_multi_select1[]">
                                            <option ng-repeat="c in clientes" value="{{c.idCliente}}" ng-click="atribuirUm($index, c)">{{c.razaoSocial}}</option>
                                            <option selected ng-repeat="c2 in clientes2" value="{{c2.idCliente}}" ng-click="limparUm($index, c2)">{{c2.razaoSocial}}</option>
                                        </select>                                       
                                    </div>                                          
                                </div>

Answer 1

$scope.corvo将包含一个数组，其中包含选定元素的ID（ value s），因此您可以发送该数组：

$http.post('/boxmlV2/cadastrocertificado/salvaCertificado', {
    urlCertificado :     $scope.certificadoIncluirAlterar.urlCertificado,
    dataValidadeCertificado : $scope.certificadoIncluirAlterar.dataValidadeCertificado.toString(),
    senhaCertificado : $scope.certificadoIncluirAlterar.senhaCertificado,
    corvo: $scope.corvo         
}).then(function(response) {
    $scope.sucesso();
}, function(response) {         
});

我假设您正在发送JSON数据，否则必须将其序列化为字符串，例如使用$scope.corvo.join(',') 。

Answer 2

这是我的js工作正常后的样子：

BoxApp.controller("CadastroCertificadoController", function($scope, $http) {

$scope.clientes = {};
$scope.listaEmpresas = [];

$scope.iniciar = function() {
    $http.get('/boxmlV2/cadastrocertificado').success(function(response) {
        $scope.clientes = response;
    });
};

$scope.iniciar();

/**
 * Trabalhando o componente picklist
 */
$scope.clientes2 = [];      
$scope.atribuirUm = function(index, c) {
    var cliente = {};
    cliente.idCliente = c.idCliente;
    cliente.razaoSocial = c.razaoSocial;
    $scope.clientes2.push(cliente);
    $scope.clientes.splice(index, 1);
}
$scope.limparUm = function(index, c2) {
    $scope.clientes2.splice(index, 1);
    $scope.clientes.push(c2);       
}

/**
 * Trecho para validar o form ao submeter.
 */
$scope.submitted = false;
$scope.submitForm = function(form, clientes2) {     
    $scope.listaEmpresas = $scope.clientes2;
    $scope.submitted = true;
    if (form.$valid) {          
        $scope.cadastraCertificado();
    }
};  

/**
 * Requisição POST (ajax)
 */
$scope.cadastraCertificado = function() {

    var dados = {
            urlCertificado : $scope.certificadoIncluirAlterar.urlCertificado,
            strDataValidadeCertificado : $scope.certificadoIncluirAlterar.strDataValidadeCertificado.toString(),
            senhaCertificado : $scope.certificadoIncluirAlterar.senhaCertificado,
            listaEmpresas : $scope.listaEmpresas                
    };

    $http.post('/boxmlV2/cadastrocertificado/salvarCertificado', dados).then(function(response) {

    }, function(response) { 
        $scope.sucesso();
    });
};  

$scope.sucesso = function() {
    $scope.closeMyPopup();
    $scope.iniciar();       
};  

$scope.closeMyPopup = function() {
    $(myModal_autocomplete).modal('hide');
};

});