In this article I will explain with an example, how to open new browser Tab from Controller with AngularJS using Button and ng-click directive.
 
 
Open new browser Tab 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 OpenTab event handler (defined within the Controller) is called. Inside the OpenTab event handler, the new browser Tab 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.OpenTab = function () {
               $window.open("//www.aspsnippets.com/");
           }
       });
    </script>
    <div ng-app="MyApp" ng-controller="MyController">
        <input type="button" value="Open Tab" ng-click="OpenTab()" />
    </div>
</body>
</html>
 
 
Screenshot
AngularJS: Open new Browser Tab from Controller example
 
 
Demo
View Demo
 
 
Downloads
Download Code