AngularJS - 解析值在ui-router中定义,但在控制器中未定义

时间:2015-11-11 20:38:12

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

我在我的路由中已经解决了我返回值的问题,这是我在console.log时定义的,但是在控制器中它是未定义的......我是Angular和Ionic的新手。

路线

.state('tab.item', {
url: '/collections/item/:itemId',
views: {
  'tab-collections': {
    templateUrl: 'templates/tab-item.html',
    controller: 'ItemCtrl',
    resolve: {
      item: function($localStorage, $stateParams){
        angular.forEach($localStorage.items, function(value, key){
          if (value.id == $stateParams.itemId){
            console.log(value);
            return value;
          }
        });
      },
    }
  }
}

控制器

.controller('ItemCtrl', function($scope, item) {
    $scope.item = item;
    console.log(item);
})

查看

<ion-view view-title="{{item.name}}">
    <ion-content>
        {{item}}
        <div>
             <li ng-repeat="image in item.images">
                 <img ng-src="{{image}}" alt="{{item.name}}">
             </li>
        </div>
        <p>{{item.name}}</p>
    </ion-content>
</ion-view>

为什么它在这里工作?

collection: function($localStorage, $stateParams){
    angular.forEach($localStorage.collection, function(value, key){
       if (value.id == $stateParams.collectionId){
          return value;
       }
    });
 },

2 个答案:

答案 0 :(得分:2)

Resolve需要您返回一个值。你在forEach循环中返回了。为了使其工作,您需要返回该循环之外。也许是这样的事情:

.state('tab.item', {
url: '/collections/item/:itemId',
views: {
  'tab-collections': {
    templateUrl: 'templates/tab-item.html',
    controller: 'ItemCtrl',
    resolve: {
      item: function($localStorage, $stateParams){
        var result;
        angular.forEach($localStorage.items, function(value, key){
          if (value.id == $stateParams.itemId && !result){
            console.log(value);
            result = value;
          }
        });
        // return outside of the loop
        return result;
      }
    }
  }
}

你也可以考虑在这里使用除forEach以外的东西,因为你不能提前摆脱循环。一个基本的for循环也可以。

答案 1 :(得分:1)

你没有在你的解析函数中返回一个值,在foreach中返回并不符合你的想法:)

.state('tab.item', {
    url: '/collections/item/:itemId',
    views: {
      'tab-collections': {
        templateUrl: 'templates/tab-item.html',
        controller: 'ItemCtrl',
        resolve: {
          item: function($localStorage, $stateParams){
            var valueToReturn;
            angular.forEach($localStorage.items, function(value, key){
              if (value.id == $stateParams.itemId){
                console.log(value);
                valueToReturn = value;
              }
            });
            return valueToReturn
          },
        }
      }
    }