Angular bootstrap ui模式窗口出现问题

Having trouble with Angular bootstrap ui modal windows

本文关键字：问题 窗口 模式 bootstrap ui Angular      更新时间：2023-09-26

我有一个带有"设置"按钮的界面，可以打开模式窗口。我想做的是从原始控制器更新作用域值。例如，在MainController中，我定义了一个"默认"主题，用于控制body标记中的主题。

$scope.theme = 'default';

在控制器中，我用类似于ng-click"changeTheme（newValue）"的东西更新视图中输入的$scope.theme的值。。它更新$scope.theme，此外，body的类由该值反映。

<body ng-controller="MainController" ng-class="{midnight: theme == 'midnight'}">

这是控制器中的模式代码

$scope.open = function (settings) {
  $scope.settings = settings;
  $modal.open({
    templateUrl: 'myModalContent.html',
    backdrop: true,
    windowClass: 'modal',
    controller: function ($scope, $modalInstance, settings) {
      $scope.settings = settings;
      $scope.submit = function () {
        $modalInstance.dismiss('cancel');
      }
    },
    resolve: {
      settings: function () {
        return $scope.settings;
      }
    }
  });
};

在我看来。。。这是我目前所拥有的。

<script type="text/ng-template" id="myModalContent.html">
  <form ng-submit="submit()">
    <div class="modal-body">
      <label>Label</label>
      <input type="text" ng-model="settings.label" />
      <label>Value</label>
      <input type="text" ng-model="settings.theme" />
    </div>
    <div class="modal-footer">
      <input type="submit" class="btn primary-btn" value="Close" />
    </div>
  </form>
</script>

当发送回在这个新的$scope.settings对象中创建的任何内容时，此示例起作用。但我希望新的设置对象也能从主控制器更新$scope.theme。我错过了什么？

问题是我对UI引导程序的基本示例没有给予足够的关注。我只想找到一种方法，让模态中的选择更新页面上的各种范围值。我已经搞懂了这个例子：

http://plnkr.co/edit/jpJX4WvHw0SSYm3pAAzq?p=preview

我的问题是理解如何处理从模态变化的多个变量。这是一个非常简单的分叉，说明了我最初试图理解的内容：

http://plnkr.co/edit/RYNcURKjGhWxUBpUlAkD?p=preview

相关文章：