2015-09-15 2 views
0

В настоящее время я использую AngularStrap v2.3.1 и AngularJS v1.4.5.AngularStrap Модальное использование

У меня возникли проблемы с работой модалов AngularStrap. Скорее всего, это непонимание того, как оно должно работать, поскольку документация не слишком полезна. Я использую синтаксис controllerAs везде в своем приложении.

Из того, что я понял, я мог бы создать объект в контроллере, как например:

vm.editModal = { 
    contentTemplate: '/templates/edit.html', 
    backdrop: 'static', 
    show: false 
}; 

И тогда, на мой взгляд, я хотел бы использовать BS-режимные с модальным свойством:

<a href="" bs-modal="ctrl.editModal"> 

Тем не менее, все, что я получаю, является пустым модальным. На самом деле это не похоже на какие-либо свойства из editModal. Поэтому это заставило меня поверить, что в этом случае используются только атрибуты заголовка и контента. Так это для основного модального?

Я также пробовал использовать $ modal service, который я вводил в контроллер. А потом попробовал:

vm.editModal = $modal({ 
    show: false, 
    contentTemplate: '/templates/edit.html', 
    backdrop: 'static', 
}); 

И я использовал тот же HTML:

<a href="" bs-modal="ctrl.editModal"> 

Однако, в этом случае, я получил кучу ошибок в консоли, и это не сработало. Некоторые ошибки;

[ng:cpws] Can't copy! Making copies of Window or Scope instances is not supported. 
[$rootScope:infdig] 10 $digest() iterations reached. 

Как только я получу эту работу, мне бы хотелось попробовать разрешить данные перед модальными нагрузками. Но я еще так далеко не получил.

Если кто-то может указать мне в правильном направлении, это было бы очень признательно.

Спасибо!

ответ

1

mgcrea имеет отличный пример, используя сервис для обмена информации с модальным

.service('$confirm', function($modal, $rootScope, $q) { 
    var scope = $rootScope.$new(); 
    var deferred; 
    scope.title = 'confirm'; 
    scope.content = 'Confirm deletion?'; 
    scope.answer = function(res) { 
    deferred.resolve(res); 
    confirm.hide(); 
    } 

var confirm = $modal({template: 'confirm.tpl.html', scope: scope, show: false}); 
var parentShow = confirm.show; 
confirm.show = function() { 
    deferred = $q.defer(); 
    parentShow(); 
    return deferred.promise; 
} 

return confirm; 
}) 

.controller('ModalDemoCtrl', function($scope, $confirm) { 
$scope.delete = function() { 
    $confirm.show().then(function(res) { 
     console.warn('answered', res) 
    }) 
}; 

Здесь ->http://plnkr.co/edit/KnRMGw5Avz2MW3TnzuVT

Надеется, что это помогает