Angularjs. Open content in new tab - angularjs

Question

I've read similar questions/answers on SO, but can't resolve my problem.
Here is the setup:
index.html
<li ng-repeat="a in article">
<a ng-click="articleDetails(a.id)">
{{a.title_en}}
</a>
</li>
js file
angular.module('myApp.article', ['ngRoute'])
.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider.when('/article/:id', {
templateUrl: 'article/article.html',
controller: 'ArticleDetailCtrl'
});
//$locationProvider.html5Mode(true);
}])
.controller('ArticleDetailCtrl', ['$http', '$routeParams', '$scope', '$window', '$location',
function ($http, $routeParams, $scope, $window, $location) {
$scope.params = 'blabla';
}])
article.html
<div>{{params}}</div>
Question: When I click the link in index.html new tab is opened as expected with correct url, however, instead of article details I get Not found on the webpage. What might be a problem?
EDIT 1: Function articleDetail is defined as follows in another controller that is used in index.html:
$scope.articleDetails = function (id) {
$scope.id = id;
$scope.window = $window.open('article/' + id, '_blank');
}

Answer 1

You cannot retain the scope of your Angular application in another window. Hence calling $window.open will open a new window which does not have your original $scope.
The scope is tied only to the window in which the ngApp is initialized.
In order to overcome this, you can use the LocalStorage of your browser.
EDIT: Please refer this