Need help with ui-router

1

Hi,

I’m new to ionic framework / ui-router and I have a routing problem.
I would appreciate any advice how to solve it.

In my Ionic app 'home’ page I have list view which fetch array from firebase and load last 10 objects - and it works fine.

Unfortunately, when I ‘click / tap’ to any list item, I got only empty object because (I assume) object id was not passed correctly.

In ‘article’ page (when I fetch it manually) article details are loaded fine. So the problem lays somewhere in routing / passing object id.

All I got in console is: Object {articleId: “”}

Here are my code snippets:

// HOME service and controller (works fine):
.factory(‘AllArticles’, [’$firebaseArray’, ‘FIREBASE_URL’, function($firebaseArray, FIREBASE_URL) {
var allArticlesRef = new Firebase(FIREBASE_URL + ‘articles/’).limitToFirst(10);
return $firebaseArray(allArticlesRef);
}])
.controller(‘homeCtrl’, function($scope, $ionicListDelegate, AllArticles){
$scope.allArticles = AllArticles;
})

// HOME html (not sure if link is configured as it should be)


{{article.title}}


{{article.description}}



// ARTICLE controller (probably where error is but i can’t figure out where)
.controller(‘articleCtrl’, function($scope, $http, $stateParams, $ionicListDelegate, $firebaseObject, FIREBASE_URL) {
$scope.currentArticle = $stateParams.articleId;
var currentArticleRef = new Firebase(FIREBASE_URL + ‘articles/’ + $scope.$stateParams);
var thisArticle = $firebaseObject(currentArticleRef);
$scope.article = thisArticle;
console.log($stateParams); // empty object
})
// ARTICLE ROUTE
.state(‘article’, {
url: ‘/article/:articleId’,
templateUrl: ‘templates/article.html’,
controller: ‘articleCtrl’
})

2

i don’t use firebase but i think that

 new Firebase(FIREBASE_URL + 'articles/' +$scope.currentArticle); --> $scope.currentArticle not $scope.$stateParams
3

hi ItamarCohen,

thank you so much for your time and suggestion but, unfortunately, it didn’t help. i am really confused now because more-or-less same code works fine as angular website (with ng-router) but with with ui-router i can’t fetch / pass object id from array. huhh…

4

hi,

can you paste you’re link code (ng-href/ui-sref) here
maybe the problem is there

5

<ion-list ui-sref="article({articleId:article.articleId})"> <ion-item class="item-thumbnail-left" ng-repeat="article in allArticles"> <h2>{{article.title}}</h2> <p>{{article.description}}</p> </ion-item> </ion-list>

6

hi

do this,

<ion-list>
 <ion-item class="item-thumbnail-left" ng-repeat="article in allArticles"  ui-sref="article({articleId:article.articleId})">
   <h2>{{article.title}}</h2>
   <p>{{article.description}}</p>
 </ion-item>
7

@ItamarCohen is correct, your link is outside the repeat so will have no id value

8

thanks guys but it still doesn’t work – just empty object in console.
again, thank you both very much and i’ll update this thred when i figure out what was the problem.
cheers…

9

hi,

check to see if the id of the article is

article.articleId
OR


how the database store the id key