Question

我有一个页面HTML，其中有一个按钮“alta”，当我点击该按钮时，它显示另一个模板作为弹出窗口，在这个弹出窗口中，我需要第一页字段的值。

这是第一个控制器中按钮“alta”的功能：

        function altaFiltro(){          
        //pop up
        alert(vm.filtros.codigo);
        $uibModal.open({
            templateUrl : 'app/entities/peticion/altaFiltro.html',
            size : 'md', // sm, md, lg
            controller: "FiltrosCtrl",
            controllerAs : 'fil',resolve: {
                filtrosVm : function() { 
                     return vm.filtros.codigo
                }
            }
        });
    }

在我的模板模型的控制器“FiltrosCtrl”中我有：

    angular.module('mecenzApp').controller('FiltrosCtrl', FiltrosCtrl);

FiltrosCtrl.$inject = [ '$scope','$uibModalInstance','Filtros'];

function FiltrosCtrl($scope, $uibModalInstance,Filtros, filtrosVm) {

    var fil = this;
    fil.cancelar = cancelar;
    function cancelar() {   
        $uibModalInstance.close();
          };

    fil.guardar = guardar;
    function guardar(){
        alert(filtrosVm);
        if(fil.filtros.nombre!=null){
            Filtros.update(fil.filtros);
            $uibModalInstance.close();
        }           
    }
}

所以我想得到vm.filtros.codigo值，但它给出了一个错误，说它没有定义，这是正常的，因为它没有在这个子控制器中定义（如果我可以这样称呼它）< / p>

Answer 1

您可以使用resolve属性来解决此问题。

        $uibModal.open({
            templateUrl : 'app/entities/peticion/altaFiltro.html',
            size : 'md', // sm, md, lg
            controller: "FiltrosCtrl",
            controllerAs : 'fil',
            resolve: {
                filtrosVm : function() { 
                     return vm.filtros.codigo
                }
            }

        });

然后filtrosVm将作为Modals控制器的依赖项出现。

function FiltrosCtrl($scope, $uibModalInstance,Filtros, filtrosVm) {

    var fil = this;
    fil.cancelar = cancelar;
    function cancelar() {   
        $uibModalInstance.close();
          };

    fil.guardar = guardar;
    function guardar(){
        alert(filtrosVm);
        if(fil.filtros.nombre!=null){
            Filtros.update(fil.filtros);
            $uibModalInstance.close();
        }           
    }
}

Answer 2

使用resolve：

将项目传递给模态实例

很像这样：

  resolve: {
    Filtros: function () {
      return $scope.Filtros;
    }
  }

这是Plunk做到了

Answer 3

最终它现在有效，我在这里得到2个字段值是代码：

父控制器：

vm.altaFiltro = altaFiltro;
    function altaFiltro(){          
        //pop up
        alert(vm.filtros.codigo+"/iniciativa="+vm.filtros.nombreinic);
        $uibModal.open({
            templateUrl : 'app/entities/peticion/altaFiltro.html',
            size : 'md', // sm, md, lg
            controller: "FiltrosCtrl",
            controllerAs : 'vm',
            resolve : {
                codigo : function() {
                            return vm.filtros.codigo;
                        } ,
                iniciativa : function() {
                            return vm.filtros.nombreinic;
                        } ,
            }

        });
    }

模型控制器：

FiltrosCtrl.$inject = [ '$scope','$uibModalInstance','Filtros','codigo','iniciativa'];

function FiltrosCtrl($scope, $uibModalInstance, Filtros,codigo,iniciativa) {

    var vm = this;
    vm.cancelar = cancelar;
    function cancelar() {   
        $uibModalInstance.close();
          };

    vm.guardar = guardar;
    function guardar(){
        alert("GUARDAR:"+codigo+"/iniciativa="+iniciativa);
        vm.filtros.codigo = codigo;
        vm.filtros.nombreinic = iniciativa;
        if(vm.filtros.nombre!=null){
            Filtros.update(vm.filtros);
            $uibModalInstance.close();
        }           
    }
}

非常感谢你们！

将数据从控制器传递到$ uibModal控制器angularjs

3 个答案: