Angular ui.router dynamic ui-sref

Question

I have an application with two states:

• profile
• settings

I have a link that repeats throughout my application:

<a ui-sref="profile({id:profile.id})" ui-sref-active="active">Current state + ID</a>

How to change ui-srefas dynamic? - represent the current state along with the current stateParam state that I want (what id)

when searching for a solution, keep in mind that I want to be able to use ui-sref-active, so it is better to avoid ng-click on something like this.

Answer 1

I think I ui-srefwill analyze what is inside (and) as an expression.

So all you have to do is this.

<a ng-repeat="step in steps" ui-sref="{{step.state}}(step.param)"></a>

Answer 2

, - if else:

<div ng-if="checkState == 'profile'">
      <a ui-sref="profile({id:profile.id})" ui-sref-active="active">Current state + ID</a>
</div>

<div ng-if="checkState == 'settings'">
      <a ui-sref="settings({id:profile.id})" ui-sref-active="active">Current state + ID</a>
</div>

, ...

Answer 3

$scope.routers = [
  {
    state: 'profile',
    params: {id: 1}
  },
  {
    state: 'settings',
    params: {id: 1}
  } 
];

View:

<a ng-repeat="router in routers" ui-sref="{{router.state}}(router.params)"></a>