How to link href of items in a list?


#1

hi,

i have a list with 3 item, A, B and C wish are called by a ng-repeat item in itemlist.
can i use each item independly like butons to goto a page ?
A => goto page1
B => goto page2
C => goto page3

thx


#2

@fabilabo, of course you can. Please check this: http://ionicframework.com/docs/components/#item-icons and this: http://ionicframework.com/docs/api/directive/ionItem/


#3

Actually you just use same href to ui.router or ui-sref name define in your router

Example

<ion-item item-type="item-icon-left" class="item-dark" nav-clear menu-close ui-sref="app.main">
            <i class="icon button-icon ion-ios7-home-outline"></i>
            {{ "home" | translate }}
</ion-item>

And your router

            .state('app.main', {
                url: "",
                views: {
                    'menuContent': {
                        templateUrl: "templates/main.html",
                        controller: "MainCtrl"
                    }
                },
                authenticate: true
            })

#4

my problem is that my list is auto populate by “ng-repeat” command, then i certainly have to add a field into my list to control the href ?
How to do that ?


#5

You could use a variable number of page in the controller, with $index but i’m not sure it’s the correct syntax.

Example:
(Template.html)

 <div ng-repeat="item in items">
 <a href="page{{number+$index}}"></a>
 </div>

(controller.js)
angular.module(…).controller(… , function(…){
$scope.number=1;

}]);


#6

thank you, it doesnt work “as is” but i will digg deeper today