Menu items look like

<a ui-sref="state1">Label</a>

The menu is formed automatically, the states are substituted from the array. How to make so that for some (not all) menu items the state is fictitious, i.e. when clicking on a link, the transition would not occur. For example, a submenu would simply open, and the page of the site would not change. Options: void (0), not existing state, state with the property abstract: true, - cause an error. It is impossible to make a reverse transition to resolve, since the original state is already lost. (or not?)

Refinement to the comment Grundy: A suggestion to do so:

 <a ui-sref="state" ng-if="state!==void(0)" >Label </a> <a ng-href="void(0)" ng-if="state===void(0)" >Label </a>

It leads to a doubling of the code. Label in my case contains code that will have to be repeated twice. I would not want to. Also, I would not want to give up ui-sref. One could do this:

 <a ng-href="path" >Label </a>

Where

 path=[path1, path2, void(0)]

But I want to do on ui-sref.

Apparently, we must also clarify. Option:

<a ng-href="path" ng-repeat="path in [path1, path2, void(0)]">Label </a>

possible, but do not want. I want something like:

 <a ui-sref="state" ng-repeat="state in [state1, state2, void(0)]">Label </a>

But this angular gives an error, because $ staite cannot be void (0). So I would like to create a dummy state that would not translate anywhere, just like href = "void (0)"

  • you just need to change the menu formation and where the transition is not needed, do not add this directive - Grundy
  • Not ice. You will need to double the code. <a ui-sref="state" ng-if="state!==void(0)"> Label </a> <a ng-href = "void (0)" ng-if = "state === void (0) "> Label </a> Label in my case contains code that will have to be repeated twice. I would not want to. Also, do not want to give up ui-sref. One could, of course, get by with ng-href. Where a transition is needed, substitute the path, where it is not needed - void (0). But I want to do on ui-sref. - Dolalex
  • All the necessary code for the demonstration must be added directly to the question. As you can see in the comments, it is completely unreadable - Grundy
  • set path=[path1, path2, void(0)] do you form yourself? - Grundy
  • . leads to the same route on which now - Grundy

1 answer 1

The answer is found thanks to @Grundy. A state named '.' and that is the desired state. As a result, we have:

 <a ui-sref="state" ng-repeat="state in [state1, state2, '.', state4]">Label </a>

Looked bad yesterday, this solution is unsuitable, because angular still tries to go to this state (with the name '.') and gives an error, remaining, however, in its original state.

But the exit is still found.

  1. We create a working condition in the minimum configuration.

    .state ('layout.fix', {views: {

      }, resolve: { path: function(){console.log('Im chost'); return true; } } })

This angular condition will be perceived as correct. You can even go over it.

  1. In the .run () block insert intercept state change:

 $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams, options){ if(fromState.name != '' && toState.name == 'layout.fix'){ event.preventDefault(); } });

Thus, if this is not the initial load fromState.name! = '' And the transition goes to a dummy state, then cancel the transition.