1

I have a strange issue where simply injecting the $modal service into my application results in strange behavior from an ngGrid instance -- the ngCanvas (and contained rows) seems to think it should be 100px shorter than the containing element.

My question is: When the $modal service is injected, does it immediately interact with the DOM in any way? I assume the answer is yes, but I wasn't able to suss it out of the source.

Edit: Using angular-bootstrap 0.7.0, angular 1.2.7

An example of how I'm using the $modal and $modalInstance:

This lives in the main controller to prep the $modal:

 var modalOptions = {
  dialogClass: 'modal admin-modal admin',
  dialogFade: true,
  backdropFade: true,
  keyboard: true,
  scope: $scope
};

$scope.unlockAccounts = function() {
  var options = _.extend(modalOptions, {
    templateUrl: '/admin/generic_users_modal.tpl.html',
    controller: 'AccountUnlockModalController'
  });

 $modal.open(options).result.then(function(res) {
   if(res) {
     while($scope.selectedUsers.length) {
       $scope.selectedUsers.pop();
     }
   }
 });
};

This is the modal controller:

  module.controller('AccountUnlockModalController', ['$scope', '$modalInstance', 'UserAPI', '$log', function($scope, $modalInstance, UserAPI, $log) {

    $scope.templateConfig = {
      description: 'unlock',
      buttonText: 'Unlock accounts',
      userPlurality: function() {
        return $scope.selectedUsers && $scope.selectedUsers.length > 1 ? 'these accounts' : 'this account';
      }
    };

    $scope.closeModal = function() {
      // passing through false to clarify that no deselection should take place
      $modalInstance.close(false);
    };

    $scope.modalFunction = function() {
      var errs = [];
      _.each($scope.selectedUsers, function(user) {
        UserAPI.unlockAccount(user.email).then(function(res) {
          if(res.status !== 200) {
            errs.push(res);
          }
        })
      });
      if(errs.length) console.warn(errs);
      // passing through false to clarify that users should be deselected
      $modalInstance.close(true);
    };
  }]);

If there's anything else you'd like to see, I'm happy to work it up. Thanks!

lyyons
  • 393
  • 3
  • 11
  • Is there a reason you are on version 7 of UI Bootstrap, it's at version 11 now. I have found more than a few times that simply upgrading can fix issues like this (while breaking other things to be fair) – JMK Jul 04 '14 at 01:42
  • Yeah, building on top of a decently-sized application. Not ready to deal with all the breaking changes. Might be worth digging into the v1.1 $modal source to see what's changed, though. FWIW, I resolved my particular issue by just giving each column a specifically designated width. – lyyons Jul 05 '14 at 16:01

0 Answers0