Угловое значение поля данных загрузки JS из асинхронного запроса HTTP

Question

Я внедрил ng-repeat для создания таблицы, содержащей источник подкачки, и все источники данных для этой таблицы поступают из API REST SharePoint.

Я столкнулся с проблемой, потому что на поля, которые мне нужно показать в источнике данных ng-repeat, есть ссылка, но мне нужно извлечь данные с этого URL-адреса. Я не знаю, могу ли я передать сообщение о проблеме или нет. Попробую с примером

Допустим, у нас есть источник данных, массив объекта SearchResult он несколько свойств, таких как:

SearchResult.ID

SearchResult.ReferenceNumber

SearchResult .CreatedBy

SearchResult.Files // Этот атрибут Files в объекте является ссылкой на страницу, содержит информацию JSON/XML о файлах. Мне нужно извлечь эту информацию и показать ссылки извлеченных файлов вместо ссылки на эту страницу.

Пожалуйста, дайте мне знать, есть ли способ отправить асинхронный вызов, чтобы получить json/xml для данного поля в пределах ng-repeat.

$scope.GetFileNames =function(query) 
{ 

    var returndata; 
    $http({ 
     method: 'GET', url: query, 
     headers: { "Accept": "application/json;odata=verbose" } 
    }). 
    success(function (data, status, headers, config) { 
     debugger; 
      returndata= data; 
     }). 
    error(function (data, status, headers, config) { 
     debugger; 
     // called asynchronously if an error occurs 
     // or server returns response with an error status. 
      returndata= data 
    }); 
    return returndata; 
} 


<td> 
    <span>{{GetFileNames(history.Files)}}</span> 
</td> 

Answer 1

Expose метод в контроллере, чтобы получить удаленные данные по ссылке, что-то вроде «GetRemoteFile», а затем использовать {{GetRemoteFile(SearchResult.Files)}} в представлении.

$scope.GetRemoteXML = function(endpoint){ 
    // use $resource or $http to get xml/json 
} 

, а затем

<li ng-repeat="item in items"> 
    {{GetRemoteXML(item.link)}} 
</li> 

Answer 2

Так вот как я должен был реализовать данную функциональность. Это не целиком основано на угловых js. Мне пришлось использовать jquery, чтобы добраться до этого обходного пути.

Во-первых, мы должны создать директиву событие нг-клик зарегистрированное с

appSearch.directive('myPostRepeatDirective', function(){ 

return function(scope, element, attrs) { 

    if (scope.$last){ 
     // iteration is complete, do whatever post-processing 
     // is necessary 
     setTimeout(function() { 

      $('[name="fileNames"]').click() 
     }, 200); 

    } 
    }; 
}); 


$scope.GetFileNames =function(query, element,$event) 
    { 
     var tar = event.target; 
     var returndata; 
     $http({ 
     method: 'GET', url: query, 
      headers: { "Accept": "application/json;odata=verbose" } 
     }). 
     success(function (data, status, headers, config) { 
      var files = "<ul>" 
      if(data.d.results.length > 0){ 


      angular.forEach(data.d.results,function (file) { 

        files += "<li> <a href='"+file.ServerRelativeUrl +"' target='_blank'>"+file.Name+" </a> </li>" 

       }); 

      } 
      files += "</ul>" 
      $(tar).html(files); 
      }). 
     error(function (data, status, headers, config) { 


     }); 
     return returndata; 
    } 





<tr ng-repeat="history in HistoryItems" my-post-repeat-directive="foo()" ng-class="{'selected':$index == selectedRow}" ng-click="setClickedRow($index)" > 
            <td> 
             <span><a ng-href="" class="link" ng-click="ChangeIframeUrl($index, history.ListItemId, history.Path)">{{history.RetailReferenceNo}}</a></span> 
            </td> 
            <td> 
             <span ng-if="history.RetailTitle == ''">{{history.RetailTitle}}</span> <span>{{history.RetailTitle}}</span> 
            </td> 

            <td> 
             <span> {{history.RetailDocumentDate | date: 'dd-MMM-yyyy'}}</span> 
            </td> 
            <td><span>{{history.Created | date: 'dd-MMM-yyyy'}} </span></td> 
            <td> 
             <span>{{history.Author}} </span> 
            </td> 
            <td> 
             <span>{{history.RetailStatus}} </span> 
            </td> 
            <td> 
             <span>{{history.RetailRevision}} </span> 
            </td> 
            <td> 
             <span name="fileNames" ng-click="GetFileNames(history.Files, this)"></span> 
            </td> 
            </tr>