# How to make ng-repeat list items link to a .html page

**URL:** <https://forum.ionicframework.com/t/how-to-make-ng-repeat-list-items-link-to-a-html-page/18962>\
**Category:** ionic-v1\
**Created:** [March 11, 2015, 7:20pm UTC](https://forum.ionicframework.com/t/how-to-make-ng-repeat-list-items-link-to-a-html-page/18962 "2015-03-11T19:20:53Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![sumit4732](https://avatars.discourse-cdn.com/v4/letter/s/a698b9/32.png) [@sumit4732](https://forum.ionicframework.com/u/sumit4732)\
**Post date:** [March 11, 2015, 7:20pm UTC](https://forum.ionicframework.com/t/how-to-make-ng-repeat-list-items-link-to-a-html-page/18962/1 "2015-03-11T19:20:53Z")

</div>

```
I am trying to build a list using ng-repeat such that if clicked on any item the list will get replaced by the content of html page linked to the tapped list item.

```

So far I have tried this,

//my app.js

.state(‘app.c.ctopic’, {  
url: “/ctopic”,  
views: {  
‘tab-ctopic’: {  
templateUrl: “tech/ctopic.html”,  
controller: ‘ChatsCtrl’  
}  
}  
})

.state(‘app.c.ctopic:chatId’, {  
url: “/c/ctopic:chatId”,  
views: {  
‘tab-ctopic’: {  
templateUrl: ‘tech/chat-detail.html’,  
controller: ‘ChatDetailCtrl’  
}  
}  
})

[//controller.js](https://controller.js)

.factory(‘Ctopic’, function() {

var chats = [ { title: ‘Arrays’, id:11 ,desc: ‘tech/ctopic/Union.html’},  
{ title: ‘Bit Field Declaration’, id:12 },  
{ title: ‘C Pointers’, id: 13 },  
{ title: ‘Conditional Statements’, id: 14 },  
{ title: ‘File IO’, id: 15 },  
{ title: ‘Function’, id: 16 },  
{ title: ‘Input & Output’, id: 17 },  
{ title: ‘Loops’, id: 18 },  
{ title: ‘Preprocessor Operators’, id: 19 },  
{ title: ‘Preprocessor’, id: 20 },  
{ title: ‘String’, id: 21 },  
{ title: ‘Structures’, id: 22 },  
{ title: ‘Typedef’, id: 23 },  
{ title: ‘Union’, id: 24 }];

return {  
all: function() {  
return chats;  
},  
get: function(chatId) {  
for (var i = 0; i \< chats.length; i++) {  
if (chats[i].id === parseInt(chatId)) {  
return chats[i];  
}  
}  
return null;  
}  
};  
})

.controller(‘ChatsCtrl’, function($scope, Ctopic) {  
$scope.chats = Ctopic.all();

})

.controller(‘ChatDetailCtrl’, function($scope, $stateParams, Ctopic) {  
$scope.chat = Ctopic.get($stateParams.chatId);  
})

//html page

 {{chat.title}}

---

<div class="post-metadata">

**Author:** ![vicmota](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/vicmota/32/96232_2.png) [@vicmota](https://forum.ionicframework.com/u/vicmota)\
**Post date:** [March 11, 2015, 8:19pm UTC](https://forum.ionicframework.com/t/how-to-make-ng-repeat-list-items-link-to-a-html-page/18962/2 "2015-03-11T20:19:41Z")

</div>

Please check the sidemenu starter template.

`$ ionic start myapp sidemenu`