更改状态angularjs时某些参数不传递值答案

【问题标题】：some params dont pass value when changing state angularjs更改状态angularjs时某些参数不传递值
【发布时间】：2018-04-05 06:07:07
【问题描述】：

我有一个奇怪的问题，我无法将某些参数的值传递给 Angular js 中的其他状态。在进行 http 请求之前，我尝试为搜索参数分配值

.state('tab.box', {
      url: '/search/box',
      params: { term: {}, sortby: {}, cat: {}, loc: {}, land: {}, ftype:{}, sortbyc: {}, sortbyp :{}, ctype:{} },
      views: {
        'tab-search': {
          templateUrl: 'templates/search-box.html',
          controller: 'BoxCtrl'
        }
      }
    })

我想使用参数传递一些值到这个状态。这是控制器

$scope.apply = function(index) {
        var listCat = $scope.checkedCat.join();
        console.log($scope.filter.filterftype)
        console.log($scope);
        $ionicHistory.currentView($ionicHistory.backView());
        $state.go('tab.box', { term:  $stateParams.term, sortby: $scope.filterSortBy, cat : listCat, loc: $stateParams.loc, land: $stateParams.land, ftype:$scope.filter.filterftype, sortbyc:$scope.filterSortByc, sortbyp:$scope.filterSortByp, ctype:$scope.filterctype}, { location: 'replace' });
      };

$scope.setBoxTypeActiveButton = function(click, index)
    {
        if(click == true){
            angular.forEach($scope.boxtypes, function(value, key) {
                if(key == index)
                {
                    $scope.boxtypes[key].click = true;
                    $scope.filter.filterftype = $scope.boxtypes[key].id;            
                }else{
                    $scope.boxtypes[key].click = false;                 
                }               
            });
        }else{
            $scope.boxtypes[index].click = false;
            $scope.filter.filterftype = '';

        }
    }

$scope.filter.filterftype = $scope.boxtypes[key].id 这一行是我将 id 值分配给 $scope 的地方

在我点击运行 apply() 函数的应用按钮后，ftype:$scope.filter.filterftype 参数没有被分配。当我console.log($stateParams) 处于下一个状态（tab.box）时，它包含空对象。

奇怪的部分是非常相似的代码，其他参数工作正常。

这是Console.log($scope.filter.filterftype)的结果id 12是状态改变前的id，console.log($stateParams)状态改变后的结果

12  BoxCtrl.js:10
{term: {…}, sortby: {…}, cat: {…}, loc: {…}, land: {…}, …}
cat:""
ctype:"no"
ftype:""
land:""
loc:""
sortby:"no"
sortbyc:"no"
sortbyp:"no"
term:""
__proto__:Object

如果我这样做 ftype:"5" 不使用 $scope 变量，它的工作原理。

我的看法：

<ion-view view-title="Filter" cache-view="false">
  <ion-nav-buttons side="right">
    <button class="button" ng-click="apply()">
        <i class="icon ion-android-done"></i>
    </button>
  </ion-nav-buttons>
  <ion-content class="padding">

  <h4 style="margin-top:5px; margin-bottom:5px;">Type</h4>
  <button ng-repeat="box in boxes" class="button button-small button-stable" ng-model="boxes.click" ng-class="box.click== true?'button-on':'button-light'" ng-click="box.click=!box.click; setBoxActiveButton(box.click, $index);" style="margin:2px"> {{box.text}}</button>

<button class="button button-full button-positive" ng-click="apply()">Apply</button>
  </ion-content>
</ion-view>

知道这里有什么问题吗？

【问题讨论】：

在state.go 上方添加console.log($scope.filter.filterftype) 并检查其中的内容
console.log 包含正确的 id，但它没有显示在参数上。
apply 函数什么时候运行？
apply() 将在我点击按钮后运行，在视图中
你说你添加了console.log请更新你添加的问题，

标签： javascript angularjs ionic-framework angular-ui-router angularjs-scope

【解决方案1】：

首先最好将所有参数对象更改为字符串而不是对象。

.state('tab.box', {
    params: { term: '', sortby: '', cat: '', loc: '', land: '', ftype: '', sortbyc: '', sortbyp: '', ctype: '' },
        views: {
        'tab-search': {
            templateUrl: 'templates/search-box.html',
            controller: 'BoxCtrl'
        }
    }
})

其次，您必须将字符串作为参数而不是数字发送。

$scope.apply = function(index) {
    var listCat = $scope.checkedCat.join();
    $ionicHistory.currentView($ionicHistory.backView());
    $state.go('tab.box', { term:  $stateParams.term, sortby: $scope.filterSortBy, cat : listCat, loc: $stateParams.loc, land: $stateParams.land, ftype:$scope.filter.filterftype.toString(), sortbyc:$scope.filterSortByc, sortbyp:$scope.filterSortByp, ctype:$scope.filterctype}, { location: 'replace' });
};

【讨论】：