1

我正在寻找并显示这个 JSON 对象数组。

[
{ 
"pictitle":"title1 ", 
"thumbpicurl":"url1",
"bigpicurl":"url2",
"picdescription":"text text" 
}, 
{ 
"pictitle":"title2 ", 
"thumbpicurl":"url1",
"bigpicurl":"url2",
"picdescription":"text text" 
},
]

JSON 由该工厂提供服务。

angular.module('picService', ['ngResource'])
.factory('picsFactory',function($resource){
  return $resource('pictures.json',{},{
  'getData':  {method:'GET', isArray:true}
  }
  );
});

此标记使用 JSON 数据的 thubmpicURL 显示迷你缩略图。

    <div class="miniImages">
        <a href="/home/{{$index}}">
        <img src="{{pic.thumbpicurl}}" class='thumbnail'/> </a>
    </div>

当用户选择缩略图时,我正在使用 stateProvider 进行路由以显示图片的放大版本。

  $stateProvider.state( 'home/:id', {
    url: '/home/:id',
    views: {
      "main": {
        controller: 'picCtrl',
        templateUrl: 'home/pics-detail.tpl.html'
      }
    } 
    });

第一个控制器返回 JSON 图片数据。

.controller('HomeCtrl', function HomeController( $scope,picsFactory ) {
  picsFactory.getData(function(picturedata){
  $scope.picParams = picturedata;
  });
})

第二个控制器正在寻找设置每个图片对象的属性。我不确定将 stateParams 设置为图片对象的正确语法是什么。

.controller('picCtrl', function picController( $scope, $stateParams ) {
  $scope.picture = $scope.picParams[$stateParams.id];
})
;

我在调试控制台中收到此错误。我认为它不喜欢我在 picCtrl 控制器中的$scope.picParams[$stateParams.id] 。

这是使用 $stateParams 的正确方法吗

TypeError: Cannot read property '0' of undefined

-- 答案:

我修改了 picCtrl 以注入 picsFactory,并且通过这个更改,它现在看起来可以工作了。

.controller('picCtrl', function picController( $scope, $stateParams, picsFactory ) {
  picsFactory.getData(function(picturedata){
  $scope.picture = picturedata[$stateParams.id];
   });

})
;
4

1 回答 1

0

其原因可能是在第二个控制器初始化之前getDataon的异步调用HomeCtrl可能未完成picCtrl,因此 picParams 为空。

HomeCtrl应该是父状态或在父 html 上声明,ui-view以便picCtrl能够访问已设置的内容HomeCtrl

于 2013-10-06T13:22:46.433 回答