簡體   English   中英

使用AngularJS在JSON URL中顯示數據

[英]Display data in JSON URL using AngularJS

我是ionic / angularjs的新手,我需要知道如何從Json網址向HTML視圖顯示數據。

因此,我的Json URL中的數據如下所示:

{
  News: [
        {
          id: "1",
          title: " It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
          image: "uploads/news/fortunaglobal_logo.jpg",
          status: "yes"
        },
        {
          id: "2",
          title: "fgdf",
          description: "hhjgh",
          image: "uploads/news/16613_10204428208286459_7484489390034618482_n.jpg",
          status: "yes"
        }
      ]
}

我在我的腳本中嘗試過:

.controller('NewsCtrl', function($scope, $http) {   

        $http.get('    "JSON URL"   ')
           .success(function(response, status, headers, config){

              window.alert('came in');
              if(status==200){

                 $scope.news = response.data['News'];
                 window.alert($scope.news );

              } else {
                 window.alert('No internet Connection');
              }
              console.log(news);
           })
          .error(function(data,status,headers,config){
              window.alert('error '+data+status);
              console.log(data);
              console.log(status);
         });
})

這在我的html頁面中

<ion-view title="News" ng-controller="NewsCtrl">
    <ion-nav-buttons side="left">
        <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
    </ion-nav-buttons>


    <ion-content  class="has-header" scroll="true" padding="true">




    <ul ng-repeat="newsS in news">
      <li>{{newsS.title}}</li>
    </ul>


    </ion-content>
</ion-view>

有人可以向我解釋我做錯了什么嗎?

由於您不夠具體,所以我只能猜測您要嘗試的內容,但是我看到一些可能有問題的事情:

$scope.news = response.data['News'];

如果上面描述的JSON是完整響應,則此數據應直接包含在您的response元素中(根據角度文檔,它實際上應被命名為data)。

因此,請嘗試以下操作:

$scope.news = response.News;

下一件行不通的是

console.log(news);

您的可變news沒有定義,也許您打算使用$scope.news

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM