AngularJs。正确读取JSON

我是AngularJS的noob，但试图通过它学习我的方式。AngularJs。正确读取JSON

我有以下控制器。它根据URL获取JSON文件。

app.controller('PortfolioItemCtrl', ['$scope', '$routeParams', '$http', 
    function($scope, $routeParams, $http) { 
     $http.get('pages/portfolio/' + $routeParams.itemId + '.json'). 
      success(function(data) { 
       $scope.item = data; 
     }); 
}]);

问题，我似乎无法读取这个JSON，如我所料。

在这里，我多么想在我的HTML获取这样的数据：

 <div ng-controller="PortfolioItemCtrl"> 
     <h1>{{item.cat}}</h1> 
     <p>{{item.desc}}</p> 
     </div>

我的JSON看起来像这样

{ 
    "item_1": { 
     "id":"1", 
     "cat": "Web design", 
     "desc": "Online magazine design for <em> \"Calcus\" <\/em> brand", 
     "images": [ 
      "img/portfolio-item-1.jpg", 
      "img/portfolio-item-2.jpg" 
     ] 
    } 
}

但它不提供任何数据。但是，如果我将{{item}}放入HTML中，我可以看到它获取了JSON文件。

请帮我理解我做错了什么。我希望你的解释和一些直接的建议，以便学习关于这个特定主题的AngularJS的重点。

来源

2014-09-05 jonny pixel

尝试

<div ng-controller="PortfolioItemCtrl"> 
    <h1>{{item.item_1.cat}}</h1> 
    <p>{{item.item_1.desc}}</p> 
    </div>

来源

2014-09-05 08:25:22 alpinescrambler

有趣的事情。但是，是的，情况就是这样。 – 2014-09-05 08:43:48

看起来你的JSON数据是

{ 
    $scope.item = { 
     "item_1": { 
      "id":"1", 
      "cat": "Web design", 
      "desc": "Online magazine design for <em> \"Calcus\" <\/em> brand", 
      "images": [ 
       "img/portfolio-item-1.jpg", 
       "img/portfolio-item-2.jpg" 
      ] 
     } 
    } 
}

所以就叫{{item.item_1.cat}}代替{{item.cat}}与您的模板不过，我觉得我已经试过了

来源

2014-09-05 08:26:06 dddd1919

是的，情况就是如此。：）谢谢 – 2014-09-05 08:44:06

AngularJs。正确读取JSON

回答

相关问题