Question

我有一个模态弹出窗口，其中包含一个复选框列表。控件列表是从列表动态生成的，ng-checked属性绑定到列表模型中的Selected属性。

如果在普通模板中生成控件列表，但是当我尝试在模式弹出窗口中绑定它时，控件会被创建但是Selected属性没有被正确绑定。

您可以在此plunkr中看到模型具有Selected属性集，当您使用复选框时，Selected属性更改。

我已尝试在父控制器的解析功能中遮挡我的对象。我怀疑这与创建2个作用域的模态窗口有关，但我认为使用对象引用作为我的模型数组的容器应该绕过它。

这是启动我的模态窗口的代码。

var modalInstance = $modal.open({
    templateUrl: 'modaltemplate.html',
    backdrop: 'static',
    controller: 'RoleModalController',
    resolve: {
      privileges: function() {
        return $scope.privileges;
      },
      role: function() {
        return null;
      }
    }
  });

这里是模态的控制器。

.controller('RoleModalController', 
["$scope", "$modalInstance", "privileges", "role",
function($scope, $modalInstance, privileges, role) {
  $scope.form = {};

  $scope.privileges = privileges;

  $scope.role = {
    Name: null,
    Description: null
  };

  $scope.ok = function() {
    $modalInstance.dismiss('ok');
  };

  $scope.cancel = function() {
    $modalInstance.dismiss('cancel');
  };

  var init = function() {
    if (!_.isNull(role)) {
      $scope.role = role;

      // for each privilege in the role, set Selected = true in the 
      // corresponding privilege in the in the privileges collection
      _.each(role.Privileges, function(priv) {
        var foundPriv = _.find($scope.privileges.all, function(p) {
          return p.PrivilegeId === priv.PrivilegeId;
        });
        _.extend(foundPriv, {
          Selected: true
        });
      });
    }
  }

  init();
}

这里是http://plnkr.co/edit/fvbHlF?p=preview

的一小部分

编辑：我刚刚更新了我的插件以显示这个＆＃34;工作＆＃34;在模态之外它并没有这样或许这不是附加范围的问题。

由于

Answer 1

我认为问题在于您使用ng-checked指令的方式。请注意，仅当ng-checked上定义的表达式求值为true时，才会在元素上设置特殊属性“checked”。在您的情况下，roleSelectionChanged()未评估为true（您可能希望使用ng-change）。

从模板中删除ng-checked指令，它应该可以正常工作。

为什么我的bootstrap-ui angularjs模式弹出窗口中的复选框没有绑定？

1 个答案: