How to open async calls in a new tab instead of new window within an AngularJS app

I recently wanted to generate a PDF on users demand and show it in a new browser tab. Sounds trivial, at first not for me 🙂 I tried it with different „solutions“ and on my way my google search result got better and better. With „open window new tab without popup blocker async“ I finally found in this thread a nice and easy solution. The trick is to remember the reference to the new window and change the location of that window when your asynchron call completes.

$scope.generatePdf = function () {
  var tabWindowId = window.open(‚about:blank‘, ‚_blank‘);

  $http.post(‚/someUrl‘, data).then( function (response) {
    tabWindowId.location.href = response.headers(‚Location‘);
  });
};

If you want to see it in action open this plunker. While testing this plunker, it seems that openWindow will open a tab, as long as the async call is quick enough (less than a second). The setTimeout is therefore set to 1001.

I hope you will find this solution quicker than I did. Please let me know if you have any questions or suggestions. Either per @leifhanack or comment here.