Burak Güneli
Burak Güneli

Reputation: 124

Can't get the value of $routeParams in a controller (AngularJs)

my config :

  .config(function($stateProvider, $urlRouterProvider) {


  $stateProvider


 .state('tab.chats', {
      url: '/chats/:id',
      views: {
        'tab-chats': {
          templateUrl: 'templates/tab-chats.html',
          controller: 'detail'
        }
      }
    })


$urlRouterProvider.otherwise('/tab/dash');

})

my controller :

.controller("detail", ["$scope", "$http", function($scope, $http, $routeParams){

   $scope.data = $routeParams.id;

my html :

<ion-view>
  <ion-content class="ata1">
    <a href="#/tab/dash" rel="nofollow"><img id="logo" src="img/falimda.png" alt="" /></a>

    <div class="clear"></div>


    <div ng-controller="detail">
      {{data}}
    </div>


    <div class="clear"></div>

    <a href="#/tab/dash" class="button button-outline button-light">Back</a>

  </ion-content>
</ion-view>

So here i'm programming a mobile application by Ionic Framework, and i couldn't solve something.

I'm trying to use this id inside my controller by using routeParams so that i can use that id to pull some data from web but unfortunately i can't reach it inside of my controller. I tried to test and print out my data inside ng-controller it didn't work. Can you help me?

Upvotes: 0

Views: 1081

Answers (2)

JB Nizet
JB Nizet

Reputation: 691635

You're using ui-router for the routing, but expecting to find the ui-router state parameters in ngRoute's routeParams service. Won't happen.

Use $stateParams, and remove the ngRoute dependency from your application, since you're using ui-router.

To fix the other, injection problem explained by the other answer, and avoid to repeat it later, I suggest you stick to the simple declaration or parameters (not using the array syntax which forces you to duplicate all service names), and use ng-annotate to make it minifiable automatically.

Upvotes: 2

Sushmit Patil
Sushmit Patil

Reputation: 1465

Change your controller code as below

.controller("detail", ["$scope", "$http", "$routeParams", function($scope, $http, $routeParams){

   $scope.data = $routeParams.id;

Upvotes: 0

Related Questions