Conditional link on <ion-item> in <ion-list> depending on current state


#1

I have a <ion-list> with <ion-item>s in my template. The items are linked using ng-href. Now I want to remove this link depending on the state that is using this template.

For elements (e.g. images) inside the ion-item I can user ng-show="$state.includes('app.showElementsOnThisState')" after I put the state into $scope.state in the controller, but this of course doesn’t work for the whole <ion-item> without duplicating it and all its content, and that I don’t want.

Any ideas?


#2

So I kinda made it work with some help on Slack:

  $scope.gotoMaybe = function (id) {
    if ($state.includes('app.showElementsOnThisState')) {
      $state.go('app.paycode', { 'id': id });
    }
  };

and using

ng-click="gotoMaybe('{{item.id}}'" 

on the <ion-item>.

It’s not pretty, and I still have the “you now tap/click on this ion-item” to take care of, but it’s working.

Hope someone here will offer a better solution, that also takes care of the “clickability” of the item in general.