как получить всплывающее окно при нажатии кнопки в angularjs?

Question

как получить всплывающее окно при нажатии кнопки в angularjs?

0

Я пытаюсь получить всплывающее окно с использованием angualrjs.I попробовал, но не смог всплывать. Ниже приведен мой исходный код.

//HTML file

<!doctype html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script src=angularfiles/angular.min.js"></script>
<script src="bootstrap/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-dialog/0.5.1/js/ngDialog.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-dialog/0.5.1/css/ngDialog.css"></script>
<script src="jsfiles/console.js"></script>
</head>
<body ng-app="myapp" ng-controller="controller" >
    <div class="container-fluid col-lg-2"  style="background-color:#848482;padding-top:25px;height:657px">


                <!-- <button class="btn btn-primary" style="background-color: black;"  ng-click="">Controlls</button> -->
                <h4>Controlls:</h4>


                 <button class="btn btn-primary" ng-dialog="firstDialogId"
        ng-dialog-controller="InsideCtrl"
        ng-dialog-data="{{jsonData}}"
        ng-dialog-class="ngdialog-theme-default"
        ng-dialog-show-close="false">Open via directive</button>

    </div>


</body>
</html>

//js file

var app=angular.module("myapp",['ngDialog']);
myapp.controller("controller",["$scope",function($scope){
    $scope.clickme=function(){
        console.log("hi");
        ngDialog.open({
            template: 'externalTemplate.html',
            controller: 'SomeController'
        });
    };
}]);

Здесь событие click не получает triggerd, когда я нажимаю кнопку. Вот и я использовал bootstrap.Can любой, пожалуйста, решите эту проблему.

Vindya Veer 29 сен. 2015, в 11:52

Источник

Теги:

angularjs

2 ответа

0

Добавьте в свой button элемент атрибут ng-click="clickme".

Ramesh Rajendran 29 сен. 2015, в 08:08

0

Несмотря на то, что событие нажатия не вызывается
Vindya Veer 29 сен. 2015, в 09:42

Ещё вопросы

Несмотря на то, что событие нажатия не вызывается

Satyam Koyani · Accepted Answer · 2015-09-29T07-29-00.000Z

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

Используйте тег ссылки для добавления внешних файлов css.
Вы создали угловой модуль myapp и его ссылочную переменную var app=angular.module("myapp",['ngDialog']); но при регистрации контроллера вы использовали myapp.controller("controller",["$scope",function($scope){ myapp, что неверно.
Здесь вы пытаетесь открыть ngDialog при нажатии кнопки, но вы не указали атрибут ng-click в html-шаблоне.
Если я считаю, что вы пытаетесь реализовать ngDialog с директивой, тогда сначала просмотрите документацию.
Укажите правильный путь шаблона ngDialog. Здесь вы не добавили шаблон.
при настройке модуля ['ngDialog'] это означает, что вы можете использовать этот модуль в приложении, но если вам нужна ссылка этого модуля, вам нужно ввести его в свой контроллер. это называется инъекцией зависимостей, которая отсутствует здесь.
Вы упомянули здесь два контроллера " SomeController " и " InsideCtrl ", но зарегистрированы ли эти контроллеры в модуле myapp?
Идите для любого подхода либо через директиву, либо через контроллер. Не используйте оба одновременно.

Для вашего лучшего понимания я создал эту демонстрацию для вас. Пройдите через это и сообщите мне, если у вас есть путаница в понимании.

Могу ли я иметь простой пример для этой концепции. Я искал много веб-сайтов .. Все они не помогают мне понять это. Может кто-нибудь дать мне простой пример.
@Vindya Veer Проверьте мой отредактированный ответ, который я дал для вас демо.