用angular和x2js解析RSS XML，然後用ng-repeat

嗨，希望有人能幫上忙。試圖弄清楚這一點我一直在絞盡腦汁。用angular和x2js解析RSS XML，然後用ng-repeat

我想解析一個xml rss文件與角度和x2js只返回項目對象。採用以下格式：

<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" 
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" 
    xmlns:dc="http://purl.org/dc/elements/1.1/" 
    xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0"> 
    <channel> 
    <title>Test Title</title> 
    <link> 
    https:somelocation.com 
    </link> 
    <description>List Title 1</description> 
    <pubDate>Wed, 26 Apr 2017 13:04:51 GMT</pubDate> 
    <dc:date>2017-04-26T13:04:51Z</dc:date> 
    <item> 
    <title>Test Title 1</title> 
    <link> 
     https://plnkr.co 
    </link> 
    <description> 
     <DIV> <P>Some description text</P> </DIV> 
    </description> 
    <pubDate>Wed, 26 Apr 2017 13:04:51 GMT</pubDate> 
    <guid> 
     https://plnkr.co 
    </guid> 
    <dc:date>2017-04-26T13:04:51Z</dc:date> 
    </item> 
</channel> 
</rss>

我可以返回結果，但是當我嘗試NG-重複在我的標記它遍歷所有的通道導致空列表對象出現在結果中。這裏是我的html：

<html ng-app="myApp"> 

    <head> 
    <script data-require="[email protected]" data-semver="4.0.0" 
    src="https://code.angularjs.org/latest/angular.min.js"></script> 
    <script src="xml2Json.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body ng-controller="listController"> 
    <ul ng-repeat="item in list"> 
    <li ng-repeat="i in item"> 
    <h2><a href="{{i.link}}">{{i.title}}</a></h2> 
    </li> 
    </ul> 
</body> 

</html>

這裏是我的腳本：

var myApp = angular.module('myApp', []); 

myApp.controller('listController', function($scope,$http){ 

    $http.get('rssFeed.xml', { 
    transformResponse: function (data) { 
    var x2js = new X2JS(); 
    var listData = x2js.xml_str2json(data); 
    return listData.rss.channel.item; 
    } 
    }).then(function successCallback(response, status){  
    $scope.list = response; 
    }, function errorCallback(response, status){ 
     console.log('Request failed' + status); 
    }); 

});

的plunkr位置爲：plunker

來源

2017-04-26 dmod40

你已經找到了解決辦法？ –

嗨阿米特，是的。我會很快回答並批准這個問題 – dmod40

我忘記返回並關閉。如果遇到此問題的其他人有幫助，請予以回答。我通過從ul標籤中刪除「ng-repeat」屬性來更新我的html，並用它替換了li ng-repeat。我還更新了腳本，將$scope.list = response;更改爲$scope.list = response.data;。通過這樣做，我能夠避免遍歷rss中通道標記下的所有內容，並且只針對項目本身。看到下面的代碼，這裏是更新的plunkr。

<html ng-app="myApp"> 
     <head> 
      <script data-require="[email protected]" data-semver="4.0.0" 
      src="https://code.angularjs.org/latest/angular.min.js"></script> 
      <script src="xml2Json.js"></script> 
      <link rel="stylesheet" href="style.css" /> 
      <script src="script.js"></script> 
     </head> 
     <body ng-controller="listController"> 
     <ul> 
      <li ng-repeat="item in list"> 
      <h2><a href="{{i.link}}">{{i.title}}</a></h2> 
      </li> 
     </ul> 
     </body> 
    </html>

這裏是我的更新腳本

var myApp = angular.module('myApp', []); 

    myApp.controller('listController', function($scope,$http){ 

     $http.get('rssFeed.xml', { 
     transformResponse: function (data) { 
     var x2js = new X2JS(); 
     var listData = x2js.xml_str2json(data); 
     return listData.rss.channel.item; 
     } 
     }).then(function successCallback(response, status){  
      $scope.list = response.data; 
     }, function errorCallback(response, status){ 
      console.log('Request failed' + status); 
     }); 

    });

來源

2018-02-11 06:26:47 dmod40

用angular和x2js解析RSS XML，然後用ng-repeat

回答

相關問題