AngularJs open link in new tab
AngularJs open link in new tab – You can use $window service to open a link in new tab in angularjs. It is very easy to open link in new tab using AngularJs. Here in this tutorial we are going to explain how you can use the $window service to open link in new tab. You can also use our online editor to edit and run the example code.
AngularJs open link in new tab
You can open a link in new tab using the following steps-
JavaScript Part –
JavaScript Part Contains the following script –
AngularJs open link in new tab Example:
<script>
var myApp = angular.module("myApp", []);
myApp.controller("myController", function($scope,$window) {
$scope.openLink = function() {
$window.open('https://www.google.com', '_blank');
};
});
</script>
|
Html Part –
This Contains the html part of the example –
AngularJs open link in new tab Example:
<div ng-app="myApp"> <div ng-controller="myController"> <input type="button" value="Open In New tab " ng-click="openLink()"> </div> |
Complete Part – Html & JavaScript Both
Let us combine the javascript and html both part to create the complete example –
AngularJs open link in new tab Example:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("myController", function($scope,$window) {
$scope.openLink = function() {
$window.open('https://www.google.com', '_blank');
};
});
</script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="myController">
<input type="button" value="Open In New tab " ng-click="openLink()">
</div>
</body>
</html>
|
If you run the above example it will produce the output something like this –
Advertisements
