ng-click使用param在angularjs中更改路由

时间:2014-10-23 16:37:05

标签: javascript angularjs angular-ui-router ionic-framework

我想用离子框架改变angularjs应用程序构建的路径,但路线没有改变

这是我的 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'
    }
  }
})   

这是我控制器的代码

  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); 

            };  

   }) 

这是我在annuaire.html中的html代码

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

2 个答案:

答案 0 :(得分:3)

尝试

$location.path(path)

而不是

$state.go(path)

您需要将$location服务注入您的控制器。

修改

如果您使用$state.go - 您应该在下一个方式使用它:

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

和HTML:

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

第一个参数是州名,而不是URL,第二个是带有参数的对象。

答案 1 :(得分:0)

我解决了我的问题

在annuaire.html中我改变了

itemClick('/menuitempage/1628')

通过

itemClick('/app/menuitempage/1628') 

我通过

更改了路线名称app.annuaire.menuitempage
app.menuitempage 

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