标签：javascript angularjs angular-ui-bootstrap

我试图使用AngularJS和UI Bootstrap将4个变量传入和传出模态窗口.不幸的是,当我从模态窗口返回参数时,只显示其中一个参数 – 其余所有参数都返回为’undefined’！

代码：

这是我打开$modal服务的地方,并传递4个参数：

$scope.open = function() {

    var modalInstance = $modal.open({
        templateUrl: 'modal.html',
        controller: 'ModalController',
        resolve: {
            var1: function() { return $scope.var1; },
            var2: function() { return $scope.var2; },
            var3: function() { return $scope.var3; },
            var4: function() { return $scope.var4; }
        }
    });

这些注入到ModalController中,如下所示：

var ModalController = function($scope, $modalInstance, var1, var2, var3, var4) {

在ModalController中,我可以很好地查看和使用这些变量.

然后我通过关闭模态窗口将它们返回到父控制器：

var ok = function() {
    $modalInstance.close($scope.var1, $scope.var2, $scope.var3, $scope.var4);
};

当在父控制器中收到这些值时问题变得清晰 – 它似乎只传递第一个参数var1.所有其他都未定义！

modalInstance.result.then(function (var1, var2, var3, var4) {
    $scope.var1 = var1;
    $scope.var2 = var2;
    $scope.var3 = var3;
    $scope.var4 = var4;
}, function () {
    console.log("Modal dismissed at: " + new Date());
});         

现在,我在UI Bootstrap文档中看到“关闭”函数需要一个承诺.我对Angular和Javascript很新,并不真正理解为什么1个变量有效,而不是多个？我认为我的结构不正确……我真的不明白解决方法是如何工作的,所以我确信我做的事情非常愚蠢.

有任何想法吗？

解决方法:

返回一个JSON对象,如：

$modalInstance.close({'var1':$scope.var1, 'var2':$scope.var2, 'var3':$scope.var3, 'var4':$scope.var4});

和

modalInstance.result.then(function (result) {
  console.log(result);
  $scope.var1 = result.var1;
      .....
}

标签：javascript,angularjs,angular-ui-bootstrap
来源： https://codeday.me/bug/20190611/1221664.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。