javascript - 如何在 angularjs 应用程序中解析 Drupal JSON 数据

标签 javascript angularjs json drupal drupal-7

我从 Drupal Rest api 获得了以下 JSON 响应。如何在我的移动应用程序 - AngularJs http 服务中解析它?

[  
   {  
      "nid":"2",
      "title":"<a href=\"/sell/test-event-1\">Test Event 1</a>",
      "field_event_list":"List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . Summery of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . ",
      "event_date":"<div class=\"date-display-range\"><span class=\"date-display-start\" property=\"dc:date\" datatype=\"xsd:dateTime\" content=\"2016-05-20T00:00:00+05:30\">Friday, May 20, 2016</span> to <span class=\"date-display-end\" property=\"dc:date\" datatype=\"xsd:dateTime\" content=\"2016-05-31T00:00:00+05:30\">Tuesday, May 31, 2016</span></div>"
   }
]

最佳答案

例如。

Controller

app.controller('MyCtrlr', function ($scope, $http) {


                      $http.get("YOUR_DRUPAL_API").success(function(response){

                         //Store your JSON Response
                                 $scope.jsonResp = [  
                                                   {  
                                                      "nid":"2",
                                                      "title":"<a href=\"/sell/test-event-1\">Test Event 1</a>",
                                                      "field_event_list":"List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . Summery of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . List of Test Event 1 . ",
                                                      "event_date":"<div class=\"date-display-range\"><span class=\"date-display-start\" property=\"dc:date\" datatype=\"xsd:dateTime\" content=\"2016-05-20T00:00:00+05:30\">Friday, May 20, 2016</span> to <span class=\"date-display-end\" property=\"dc:date\" datatype=\"xsd:dateTime\" content=\"2016-05-31T00:00:00+05:30\">Tuesday, May 31, 2016</span></div>"
                                                   }
                                                ];

                       });

 });

//AngularJS filter to strip HTML tags from your JSON properties

app.filter('getPlaintext', function() {
    return function(text) {
      return  text ? String(text).replace(/<[^>]+>/gm, '') : '';
   }
  });

查看

<table ng-controller="MyCtrlr">
                <tr>
                  <td>nid</td>
                  <td>title</td>
                  <td>field_event_list</td>
                  <td>event_date</td>
                </tr>

                <tr ng-repeat="data in jsonResp">

                                <td>{{data.nid}}
                                </td>
                                <td>{{data.title | getPlaintext}}</td>

                                <td>{{data.field_event_list | getPlaintext}} 
                                </td>
                                <td>{{data.event_date | getPlaintext}}
                                </td>

                            </tr>

</table>

参见Fiddle

关于javascript - 如何在 angularjs 应用程序中解析 Drupal JSON 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37043748/

相关文章:

node.js - 在更改、Angular 和 Node JS 上保存到数据库

javascript - 如何在angularjs中使用session

javascript - asp.net 上的慢速 C# websockets

javascript - 尝试从排列的 JSON 键中删除引号

javascript - 纵向?

javascript - 针对特定 ajax 调用在全局 $.ajax 事件上触发函数

javascript - .js 文件中的变量不会保留 AJAX 的值

javascript - 不要在循环内创建函数 jshint

javascript - 将数据弹出窗口添加到 d3js map

javascript - 使用 Backbone.js 从数据库获取完整响应