AngularJS angular-modal-service, дающий мне ошибку

Я пытаюсь (безуспешно) использовать AngularModalService. Выполнение задания копирования/вставки из общепринятого простого руководства дает мне ошибку.AngularJS angular-modal-service, дающий мне ошибку

Это учебник, для справки: http://www.dwmkerr.com/the-only-angularjs-modal-service-youll-ever-need/

Javascript:

var app = angular.module('app', ['angularModalService']); 

app.controller('Controller', function($scope,ModalService) { 

    $scope.show = function() { 
     ModalService.showModal({ 
      templateUrl: 'modal.html', 
      controller: "ModalController" 
     }).then(function(modal) { 
      modal.element.modal(); // this is the problem 
      modal.close.then(function(result) { 
       $scope.message = "You said " + result; 
      }); 
     }); 
    }; 
}); 

app.controller('ModalController', function($scope, close) { 
    $scope.close = function(result) { 
     close(result, 500); 
    }; 
}); 

</script>

HTML (уродливее в учебнике, но должно быть проще)

<div class="container" style="min-width: 700px; max-width: 700px; margin: 50px auto;" data-ng-app="app" data-ng-controller="Controller"> 
    <h3>Angular Modal Service</h3> 
    <a class="btn btn-default" href ng-click="show()">Show a Modal</a> 
    <p>{{message}}</p> 

    <!-- The html template --> 
    <script type="text/ng-template" id="modal.html"> 
     <div class="modal fade"> 
      <button type="button" ng-click="close('Cancel')" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">Yes or No?</h4> 
     </div> 
     <div class="modal-body"> 
      <p>It is your call...</p> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" ng-click="close('No')" class="btn btn-default" data-dismiss="modal">No</button> 
      <button type="button" ng-click="close('Yes')" class="btn btn-primary" data-dismiss="modal">Yes</button> 
     </div> 
    </script> 

</div>

я ошибка get является «неопределенным, не является функцией» на указанной выше строке, а именно:

modal.element.modal();

Поиск в Google не привел меня ни к чему конкретному. Надеюсь, я просто упускаю из виду что-то глупое.

источник

2014-11-23 kiss-o-matic

Учебник использует угловую 1.2.9. Какую версию ты используешь? – cgTag

Hi - 1.3.0-rc5. –

angularModalServicebootstrap js. Вызовите следующий файл в файле index.html и попробуйте.

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>

источник

2014-11-23 17:17:45 Asik

Это меня куда-то, вроде. Я обнаружил, что мне также нужен файл boostrap.css, а также jquery (которого не было в первую очередь). Спасибо за вашу помощь! –

да, добро пожаловать. еще одна вещь, почему вы не пытаетесь использовать угловые бутстрап-директивы для диалога. – Asik

B/c Я относительно новичок в Angular. Мои навыки кодирования переднего конца почти всегда находятся на рабочем столе. Таким образом, код для меня не слишком сложный, но я не знаком со многими концепциями. У меня есть рабочий модальный диалог прямо сейчас, но он поддерживает только open/close. Не будет работать так, как логин. Когда я искал Google, почти все привело к AngularModalService. Вы видите, что я работаю (на более старой версии Angular) здесь. http://onfilm.us/image_index.html. Для этого я обычно хотел бы закрыть w/X, но если пользователь нажимает теги, он должен делать что-то еще. –

Ошибка возникает из-за того, что вы вызываете метод Bootstrap для отображения модальности.

В отличие от ответа Asik в выше, AngularModalService делает не требуют Bootstrap, но если вы используете Bootstrap модальности, то вам необходимо включить бутстрапом файл расслоение плотной.

вопрос упоминается здесь: https://github.com/dwmkerr/angular-modal-service/issues/14

Пользовательские модальности, не требующие Bootstrap, приведены в examples page

источник

2015-11-05 04:45:24 user3331405

Приветствия. Я также рассмотрю это. ;) –

AngularJS angular-modal-service, дающий мне ошибку

ответ

Смежные вопросы