Question

有没有办法更新angularjs uibModal的父控制器并更新其值而不关闭它？我想立即更新该变量，而不是等到uibModal关闭。我知道我可以使用resolve，但是这迫使我关闭模式，以便将任何内容传回来以进行更新。

我尝试将范围传递给uibModal以便更新该变量。没有成功。

angular.module('app', [
  'ui.bootstrap'
])

.controller('ctrl', function ($scope, $uibModal) {
  'use strict';
  var vm = this;
  vm.value = false;
  
  
  $scope.openModal = function () {
    $uibModal.open({
      template: '<div class="modal-header">' +
                    '<h3 class="modal-title">Hello</h3>' +
                '</div>' +

                '<div class="modal-body">I\'m a modal!</div>' +

            '<div class="modal-footer">' +
                '<button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>' +
                '<button class="btn btn-warning" type="button" ng-click="update()">Update</button>' +
            '</div>',
      controller: function ($scope, $uibModalInstance) {
        $scope.update = function() {
          console.log('update vm.value from here right after clicking the button');
        }
      
        $scope.cancel = function () {
          $uibModalInstance.dismiss('cancel');
        };
      }
    })
  };
});

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@*" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <script data-require="angular.js@1.5.0" data-semver="1.5.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.4.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="app" ng-controller="ctrl" class="container">
    <button class="btn btn-primary" type="button" ng-click="openModal()">Open modal</button>
  </body>

</html>

更新uibModal的父级而不关闭它。动态更新变量

0 个答案: