In this article I will explain with an example, how to open new browser Popup Window from Controller with AngularJS using Button and ng-click directive.
 
 
Open new browser Popup Window from Controller in AngularJS
The below HTML Markup consists of an HTML DIV to which ng-app and ng-controller AngularJS directives have been assigned.
Note: If you want to learn more about these directives, please refer my article Introduction to AngularJS.
 
The HTML markup consists of an HTML Button which is assigned AngularJS ng-click directive.
Note: If you want to learn more about ng-click directive, please refer my article AngularJS: Implement Button click event using ng-click directive example.
 
When the Button is clicked the OpenPopupWindow event handler (defined within the Controller) is called. Inside the OpenPopupWindow event handler, the new browser Popup Window is opened from Controller.
<html>
<head>
    <title></title>
</head>
<body>
   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
   <script type="text/javascript">
       var app = angular.module('MyApp', [])
       app.controller('MyController', function ($scope, $window) {
           $scope.OpenPopupWindow = function () {
               $window.open("//www.aspsnippets.com/", "popup", "width=300,height=200,left=10,top=150");
           }
       });
    </script>
    <div ng-app="MyApp" ng-controller="MyController">
        <input type="button" value="Open Popup Window" ng-click="OpenPopupWindow()" />
    </div>
</body>
</html>
 
 
Screenshot
AngularJS: Open new Browser Popup Window from Controller example
 
 
Demo
View Demo
 
 
Downloads
Download Code