/ AngularJS

Getting open in new tab with CMD+Click to work with ng-click

I got a bug card which detailed that at some point CMD+Click stopped working on one of our pages. The culprit ended up being when we switched from using a standard <a href> tag to using an ng-click. The ng-click code essentially dynamically generated the url and then ran $window.location.href = url;. This caused the page to navigate to the new URL in the current tab. The side-effect of this was that CMD+Click or CTRL+Click stopped the new tab behavior. So this is what I did to fix it.

On the ng-click I passed the $event along to the called function:

<th scope="row" ng-click="myCtrl.goToAsset(asset, $event)">

Then in my controller I take the $event and I check to see if it has the property metaKey which tells me that CMD or CTRL was pressed when clicking the link. If true then we open in a new tab. If not, we dont.

goToAsset = function(asset, $event){
    //var url = Code to get URL for asset
    if($event.metaKey){
      $window.open(url, '_blank');
    }else{
      $window.location.href = url;
    }
  }

Corey Snyder

Corey Snyder

Senior Front-End Engineer for Aver Inc.. I have independently developed & released multiple video-games. I play Ice Hockey, I race FPV Drones, and I love my Subaru WRX STI.

Read More