AngularJS从JSON获取数据 [英] AngularJS get data from json

问题描述

我正试图从Json数据中获取信息，但对我而言不起作用.我不确定自己在做什么错.

I'm trying to get from Json data but it doesn't worked for me. I'm not sure what I'm doing wrong.

Angular Ajax API调用:

Angular Ajax API call :

<script>
    function PostsCtrlAjax($scope, $http) {
        $http({
            method: 'POST',
            url: 'js/posts.json'
        }).success(function(data) {
            $scope.posts = data.deals;; // response data 
        });
    }
</script>

HTML数据绑定

<div id="ng-app" ng-app ng-controller="PostsCtrlAjax">
    <div ng-repeat="post in posts">
         <h2>
    <a href='{{post.url}}'>{{post.title}}</a>
    </h2>

        <div class='time'>{{post.time}} - {{post.author}}</div>
        <p>{{post.description}}</p>
        <img ng-src="{{post.banner}}" />
    </div>
</div>

Posts.json:

Posts.json:

{
   "result":"SUCCESS",
   "resultMessage":"",
   "deals":[
      {
         "title":"Multiple Ajax Image Upload without Refreshing Page using Jquery.",
         "url":"http://www.9lessons.info/2013/08/multiple-ajax-image-upload-refreshing.html",
         "banner":"https://lh5.googleusercontent.com/-VWIAbbjR1QM/Uf_v9v9LCbI/AAAAAAAAIAo/4ZhYhP3lcCg/s550/multiple.jpg",
         "description":"Today I am presenting the most important social networking feature called multiple ajax image upload without refreshing the page using jquery and PHP. We just modified few lines of code in jqery.form.js plugin and renamed that to jquery.wallform.js. This feature is one of the key feature in Wall Script sale, big thanks to Arun Sekar for this code trick.",
         "time":"Tuesday, August 6, 2013",
         "author":"Srinivas Tamada"
      },
      {
         "title":"Wall Script 6.0",
         "url":"http://www.9lessons.info/2013/07/wall-script.html",
         "banner":"https://lh5.googleusercontent.com/-ErPa0tEQgLs/UfZzaQ3NcFI/AAAAAAAAH7o/h_KH8Rf4AXs/s550/WallBanner.jpg",
         "description":"Introducing the brand new Wall Script 6.0 with enrich social network features. Exactly year later I did released Wall Script previous version, it got awesome response and outstanding sale. This script IDEA was came out from my imagination, introducing powerful features like Conversations, OEmebd URL expanding system, Like/Share and Multiple image slider.",
         "time":"MONDAY, JULY 29, 2013",
         "author":"Srinivas Tamada"
      }
   ],
   "total":1207
}

我想从json文件的标题，URL，横幅等中获取信息.但是我没有从json文件中获取任何数据.我该怎么办?

I want get from json file title, url, banner etc. But I didn't get any data from my json file. How can i do that?

推荐答案

您的JSON与本教程不同，因此，您不应指望代码能正常工作.您需要更改它.你尝试过吗?

Your JSON isn't the same as the tutorial, so, you shouldn't expect the code to work. You need to change it. Did you try this?

<script>
  function PostsCtrlAjax($scope, $http) {
    $http({method: 'POST', url: 'js/posts.json'}).success(function(data) {
      $scope.posts = data.deals; // response data 
    });
  }
</script>

这篇关于AngularJS从JSON获取数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！