DesignerGuy DesignerGuy -4 years ago 100
Javascript Question

ui-sref on tr element won't open in new tab

I have repeating table rows and a

ui-sref
attribute set on them. When clicked, they navigate to the correct location. However, they cannot be ⌘ command-clicked (or opened in a new tab).

I'm assuming this is because they set a
href
that is honored when the elements is an anchor tag (
<a>
), but not on other elements.

<tr ng-repeat="item in items" ui-sref="view-item({itemId:item.id})">


Any ideas for a quick fix?

Answer Source

I was able to accomplish what I wanted with a ng-click function.

app.run(function($rootScope, $state) {

    $rootScope.navigate = function($event, to, params) {

        // If the command key is down, open the URL in a new tab
        if ($event.metaKey) {
            var url = $state.href(to, params, {absolute: true});
            window.open(url,'_blank');

        } else {
            $state.go(to, params);
        }

    };

});

Usage

<tr ng-repeat="item in items" ng-click="navigate($event, 'view-item',{itemId:item.id})">
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download