диалог Угловая самозагрузки никогда не открывает

Question

У меня есть следующий код:

angular.module('myApp').controller('modalClickItemController', function ($scope, $dialog) { 

$scope.openDialog = function(opts){ 
    console.debug('bar'); 
    var d = $dialog.dialog(opts); 
    d.open().then(function(result){ 
     console.debug('foobarbazz'); 
    }); 
} 

}); 

Это используется в директиве, как так:

angular.module('myApp') 
.directive('modalClickItem', function() { 
    return { 
     restrict: 'A', 
     controller: 'modalClickItemController', 
     link: function postLink(scope, el, attr){ 
      scope.objectId = attr.objectId; 
      scope.objectType = attr.objectType 
      scope.opts = { 
       backdrop: true, 
       keyboard: true, 
       backdropClick: true, 
       template: "<div class='modal-header'>Hi!!!</div><div class='modal-body'>Buy!!!</div>", 
    //     templateUrl: 'views/'+scope.objectType+'_modal.html', 
       controller: 'modalCtrl' 
      } 

      el.on('click', function(){ 
       scope.openDialog(scope.opts); 

      }); 
     } 
    }; 
}); 

Этот код печатает бар, однако он никогда не печатает foobarbazz. Если я вставляю debugs в угловой бутстрап, он переходит в открытый метод и возвращает обещание, но никогда не открывает диалог.

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

Почему?

Answer 1

Я использую jquery.bootstrap.js, он очень маленький и простой, похожий на easyui.

$("#loginwrap").dialog({ 
     title: "Login" 
    , buttons: [ 
     { 
      text: "Close" 
      , classed: "btn-primary" 
      , click: function() { 
       $(this).dialog("close"); 
      } 
     }, 
     { 
      text: "Login" 
      , classed: "btn-success" 
      , click: function() { 
       //your login handler 

       $(this).dialog("close"); 
      } 
     } 
     ] 
});