build a model dialog

Question

Hi All I am using Angular 4.0. And I and to build a model dialog on button click event. can you please share simple code in Angular

Laxmidhar Sahoo · Answer

sir go through some stapes 1 - create a html file named Popup.html like bellow code > html xmlns = http://www.w3.org/1999/xhtml > head > title > title > head > body > Thanks you body > html > pest the bellow code in the view page @{ Layout = null ; } > html data-ng-app = test > head > @* link href = //maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css rel = stylesheet > link href = https://gitcdn.github.io/bootstrap-toggle/2.1.0/css/bootstrap-toggle.min.css rel = stylesheet > script src = https://code.jquery.com/jquery-2.1.3.min.js > script > script src = //maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js > script > script src = https://code.angularjs.org/1.4.7/angular.js > script > script src = https://gitcdn.github.io/bootstrap-toggle/2.1.0/js/bootstrap-toggle.min.js > script > *@ script src = //ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.js > script > script src = //angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.4.js > script > link href = //netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css rel = stylesheet > script > angular.module('PopupDemo' ['ui.bootstrap']); angular.module('PopupDemo') .controller('PopupDemoController' ['$scope' '$modal' function ($scope $modal) { $ scope.open = function () { var modalInstance = $modal.open({ templateUrl: 'Popup.html' }); alert(OK); } } ] ); script > head > body ng-app = PopupDemo > div ng-controller = PopupDemoController > a ng-click = open() > Open Popup a > div > body > html >

Akshay Phadke · Answer

simple and straight forward code Open Modal &times; Modal Header Some text in the modal. Close

Ankit Sharma · Answer

Hi Sachin Please visit belwo links https://stackoverflow.com/questions/43533463/how-to-create-a-modal-popup-that-is-compatible-with-angular-4 https://material.angular.io/components/dialog/overview