Как я могу получить данные заголовка и гиперссылок из JSON ULR из экспортированного листа Google? - PullRequest
0 голосов
/ 05 февраля 2020

Я могу получать данные с G-листа и отображать их, но мое требование - также отображать имя листа и гиперссылки. Имя листа не должно фильтроваться при поиске, оно всегда должно отображать только фильтруемые данные

Информация о данных ячейки гиперссылки из JSON feed UEL похожа на "gsx $ topi c": {"$ t ":" Показатели охвата глобальной аудитории "}," gsx $ response ": {" $ t ":" Инструментарий глобального портфолио продуктов Verizon Media (внутренняя таблица) "}," gsx $ _cre1l ": {" $ t ":" https://docs.google.com/spreadsheets/d/10tz7wQFG7OIMZgI59SnUF3ER

Информация заголовка хранится в JSON URL-адресе, как показано ниже. "Title": {"type": "text", "$ t": "Data"}

you can find my sample code below

<div ng-app="sample" ng-controller="sampleController">        
    <div class="black">      
        <input type="text" name="search" ng-model="search"
               placeholder="search" ng-click="didSelectLanguage()"/>          
    </div>
    <br>
    <br>
    <br>
  <table  style="border: 1px solid black ;">
    <tbody>
        <tr>
            <td><center><b>Question</b></center></td>
            <td ><center><b>Response</b></center></td>
        </tr>
      <tr ng-repeat="user in users | filter:searchFilter">
        <td style="border: 1px solid black ; width:30%;white-space: pre-wrap;">{{user.gsx$topic.$t}}</td>
        <td style="border: 1px solid black ; width:70%;white-space: pre-wrap;">{{user.gsx$response.$t}}</td>
      </tr>
    </tbody>
  </table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script>
angular.module('sample', []).
 controller('sampleController', ['$scope', '$http', function ($scope, $http) {              
    var url = "https://spreadsheets.google.com/feeds/list/153Obe1TdWlIPyveZoNxEw53rdrghHsiWU9l-WgGwCrE/1/public/values?alt=json";
// var url2 = "https://spreadsheets.google.com/feeds/list/153Obe1TdWlIPyveZoNxEw53rdrghHsiWU9l-WgGwCrE/2/public/values?alt=json";
    $http.get(url)
    .success(function(data, status, headers, config) {     
         $scope.users = data.feed.entry;
         console.log($scope.users);
    })
    .error(function(error, status, headers, config) {
         console.log(status);
         console.log("Error occured");
    }); 
    $scope.search='';
    $scope.searchFilter=function(item){
        if(item.gsx$topic.$t.indexOf($scope.search) != -1 || item.gsx$response.$t.indexOf($scope.search) != -1){
        return true;
            }
      return false;
    }

}]);
</script>

1 Ответ

0 голосов
/ 07 февраля 2020

Ваша функция searchFilter() выполняет поиск только в атрибутах gsx$topic.$t и gsx$response.$t, поэтому теперь вам нужно отобразить title и гиперссылку (link) атрибутов в вашем представлении.

enter image description here

Затем в вашем коде используйте:

  1. user.link[0].href для отображения ссылки.
  2. user.title.$t для отображения заголовка.

enter image description here

Примерно так:

(function() {
  angular.module('sample', []).
  controller('sampleController', ['$scope', '$http', function($scope, $http) {
    var url = "https://spreadsheets.google.com/feeds/list/153Obe1TdWlIPyveZoNxEw53rdrghHsiWU9l-WgGwCrE/od6/public/values?alt=json";

    $http.get(url)
      .success(function(data, status, headers, config) {
        $scope.users = data.feed.entry;
      })
      .error(function(error, status, headers, config) {
        console.log(status);
        console.log("Error occured");
      });
    $scope.search = '';
    $scope.searchFilter = function(item) {
      if (item.gsx$topic.$t.indexOf($scope.search) != -1 || item.gsx$response.$t.indexOf($scope.search) != -1) {
        return true;
      }
      return false;
    }
  }]);
}());
.view,
.view tbody td {
  border: #b9b9b9 solid 1px;
}

.view thead th {
  border-style: none;
  font-weight: bold;
  text-align: center;
}

.view tbody td {
  white-space: pre-wrap;
}

.view. thead th.title {
  width: 10%;
}

.view thead th.question {
  width: 20%;
}

.view thead th.response {
  width: 70%;
}
<div ng-app="sample" ng-controller="sampleController">
  <div class="black">
    <input type="text" name="search" ng-model="search" placeholder="search" ng-click="didSelectLanguage()" />
  </div>
  <br>
  <br>
  <br>
  <table class="view">
    <thead>
      <tr>
        <th class="title">Title</th>
        <th class="question">Question</th>
        <th class="response">Response</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="user in users | filter:searchFilter">
        <td><a href="{{user.link[0].href}}" title="{{user.link[0].href}}">{{user.title.$t}}</a></td>
        <td>{{user.gsx$topic.$t}}</td>
        <td>{{user.gsx$response.$t}}</td>
      </tr>
    </tbody>
  </table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...