CODEWITHSUNDEEP
javascriptangularjsangular-ui-routerionic-framework
tarek fellah
tarek fellah

Reputation: 367

ng-click change route in angularjs with param

I would like to change the route of an angularjs application build with ionic framework, but the route didn't change

this is my code of app.js

angular.module('starter', ['ionic', 'starter.controllers'])
.state('app.annuaire.menuitempage', {
  url: "/menuitempage/:ID",
  views: {
    'menuContent' :{
      templateUrl: "templates/menuItemPage.html",
      controller: function($stateParams){
      $stateParams.ID  ;
     }
    }
  }
})

.state('app.annuaire', {
  url: "/annuaire",
  views: {
    'menuContent' :{
      templateUrl: "templates/annuaire.html",
      controller: 'MenuItemCtrl'
    }
  }
})

And this is the code of my controller

  angular.module('starter.controllers', [])
  .controller('MenuItemCtrl', function($scope, $http, $location) {
    $scope.itemsMenu = {};

            var responsePromise =   $http.get("http://monguidepratique.com/mobile/getCategories.php?parent_id=0");

            responsePromise.success(function(data, status, headers, config) {
                //alert(data);
                $scope.itemsMenu = data;
            });
            responsePromise.error(function(data, status, headers, config) {
                alert("AJAX failed!");
            });
   $scope.itemClick = function(path){
            alert(1);
            $location.path(path); 

            };  

   })

And this is my html code in annuaire.html

 <div class="col"  ng-click="itemClick('/menuitempage/1628')"><img class="img_menu" src="img/home.png"><p class="titre_center">Accueil</p></div>

Upvotes: 1

Views: 15708

Answers (2)

tarek fellah
tarek fellah

Reputation: 367

I solved my problem

in annuaire.html i changed 

itemClick('/menuitempage/1628')

by

itemClick('/app/menuitempage/1628')

and i changed the route name app.annuaire.menuitempage by 

app.menuitempage 

.state('app.menuitempage', {
  url: "/menuitempage/:ID",
  views: {
    'menuContent' :{
      templateUrl: "templates/menuitempage.html",
      controller: 'SubMenuCtrl'
    }
  }
})

Upvotes: 0

ababashka
ababashka

Reputation: 2101

Try

$location.path(path)

instead of

$state.go(path)

You need to inject $location service into your controller.

Edit

If you are using $state.go - you should to use it next way:

$scope.itemClick = function(id){
  $state.go('app.annuaire.menuitempage', {'ID': id})
};

And HTML:

<div class="col"  ng-click="itemClick(1628)"><img class="img_menu" src="img/home.png"><p class="titre_center">Accueil</p></div>

The first param is state name, not URL, the second is an Object with your params.

Upvotes: 3

Related Questions