引导角模式对话框:不能从选择返回值

bootstrap-angular modal dialog: can not return value from select

本文关键字：不能 选择 返回值 对话框 模式      更新时间：2023-09-26

我有一个angular-bootstrap模态对话框，模板如下(jade语法):

div.modal-body
  select(ng-model="chosenProject" id="chosenProject",  ng-options="c.value as c.name for c in selectItems")
div.modal-footer
  button.btn.btn-primary(ng-click="ok()")   Change project
  button.btn.btn-warning(ng-click="cancel()")  Cancel

数组的预填充工作正常。Dialog配置了它的控制器，该控制器定义了简单的ok()函数，下面是控制器体中的例外:

        $scope.chosenProject = 0;  // needed to have selected initial item with value=-1 in the select
        $scope.ok = function () {
            console.log("OK clicked, chosenProject " + $scope.chosenProject);
            $modalInstance.close($scope.chosenProject);
        };

函数工作正常。根据console.log， $scope。无论我在select中选择什么，chosenProject都保持不变，只是返回我在"$scope"行中预设的内容。chosenProject = 0;

这个问题是因为你的控制器和模态模板之间存在一个transclusion作用域。

试试这个-在模态的控制器中，替换:

$scope.chosenProject = 0;


$scope.chosenProject = {
    value: 0
};

和模态模板，替换

select(ng-model="chosenProject" id="chosenProject"  
       ng-options="c.value as c.name for c in selectItems")


select(ng-model="chosenProject.value" id="chosenProject" 
       ng-options="c.value as c.name for c in selectItems")

选择的项目应该被正确捕获。

您需要将chosenProject返回

modalInstance.result.then(function(result) {
});

如果你在一个页面中需要更多的对话框，这是一个非常简单的对话框服务。

相关文章：