Opening in new tab with ui-sref and $state.go

Question

So I am having an issue with using these two. If I right click on the ui-sref and click open in new tab it opens just fine and I stay logged in. However if I right click on an item that has an ng-click and I use $stae.go it logs me out of my app and does not navigate me to the page. Is there a way I can get the ui-sref new tab behavior while using $state.go?

Here is some code:

If I right click and open in new tab it works fine

        <a ui-sref="app.locations" ui-sref-active="active"
           ng-class="{active: $root.state.includes('app.locationDetail')}">
            <div class="sub-menu-icon">
                <i class="icon-locations"></i>
            </div>
            <span class="sub-menu-label">Locations</span>
        </a>

If I right click and open in new tab and this method gets called it logs me out and doesnt navigate me.

<a href ng-click='vm.viewDetail(dataItem)'><span>" + value + "</span></a>

which calls this in the viewDetail method

vm.viewDetail = function ($event, dataItem) {
    var id = dataItem.id;
    $state.go(vm.detailRoute, {id: id});
};

Is there something I need to add to the $state.go method to stop this from happening?

Why are you not using the same method with the other link (href instead of ngClick)? — Alon Eitan, Feb 04 '19 at 15:57
I'm not sure I understand this question and the issue you're having. You have the first state `app.locations` which works fine as you said, and you have another state `app.locationDetail` that you call from the controller using the `ngClick` directive, right? Can you please show the part of the view where you use `ng-click` instead of `ui-sref`? I need to understand the reason for using ng-click and not `ui-sref="app.locationDetail({id: id})"` directly from the view — Alon Eitan, Feb 04 '19 at 16:11
@AlonEitan ah, the `app.locationDetail` can be different states. It's not always that it can be multiple different states. Which are defined in the controller. It could be `app.deviceDetail` and others. The controller knows which one to use — Zach Starnes, Feb 04 '19 at 16:19
Now I understand :) Well it won't work with the current logic, but I think you should check the demo provided in [this answer](https://stackoverflow.com/a/42556341/754119) that demonstrating how to bind the state name as a parameter. There are other good examples there that might work — Alon Eitan, Feb 04 '19 at 16:28

score 0 · Answer 1 · answered Feb 04 '19 at 18:56

if you use ng-click,Inject $window service in to your controller.

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope, $window) {
  $scope.viewDetail = function(dataItem) {
    var id = dataItem.id;
    $window.open('/'+vm.detailRoute+'/'+id);
  };
});

Opening in new tab with ui-sref and $state.go

1 Answers1