Difference between ui-sref and $state.go in AngularJS UI-Router

Is there any functional difference between ui-sref and $state.go()?

ui-sref is used in <a>...</a> and $state.go('someState') is used in a controller.

In HTML, I would use:

<a ui-sref="currentState.state1">Link</a>

whereas in a function I would use something like:

if(someCondition) {
    $state.go('currentState.state1');
}

So, is that it or do I need to add something after $state.go()? Assuming current state is currentState.

Solution 1:

There is no functional difference between ui-sref and $state.go. See the doc

Activating a state

There are three main ways to activate a state:

• Call $state.go(). High-level convenience method.
• Click a link containing the ui-sref directive.
• Navigate to the url associated with the state.

So, these are at the end doing the same, and as we can see in the code of the ui-sref directive:

...
element.bind("click", function(e) {
    var button = e.which || e.button;
    if ( !(button > 1 || e.ctrlKey || e.metaKey || e.shiftKey || element.attr('target')) ) {

      var transition = $timeout(function() {
        // HERE we call $state.go inside of ui-sref
        $state.go(ref.state, params, options);
      });

it does call $state.go()

And also as discussed here: ui-sref:

ui-sref='stateName' - Navigate to state, no params. 'stateName' can be any valid absolute or relative state, following the same syntax rules as $state.go()

Solution 2:

Yes, there is a difference. As you can see in the question:

Ionic framework $state.go('app.home'); is adding back button on page where i want to go (how to remove it)?

the $state.go by default adds a back button. The solution to make it behave exactly the same way is to call:

$ionicHistory.nextViewOptions({disableBack: true});

before calling $state.go.