使用AngularJS如何檢查文件夾中是否存在PDF文件？

我有一個學生名單。
對於一些學生，我必須顯示一個鏈接，點擊此鏈接，他們的進度卡應該加載（這是一個.pdf文件）。對於其他人，鏈接不應顯示。使用AngularJS如何檢查文件夾中是否存在PDF文件？

我已經通過給他們的進度卡給同一個學生ID做了這個，如果是這個特定的學生，然後顯示鏈接;否則，不要顯示鏈接。我可以這樣做，只有5或6名學生。我無法爲1000名學生做這個。

以下是我的AngularJS代碼：

if (response.student_id == 'SD0001' || response.student_id == 'SD0002' || response.student_id == 'SD0004') { 
 
    $scope.pdfData = true; 
 
    $scope.StudentPDFFile = response.student_id+'.pdf'; 
 
} else { 
 
    $scope.pdfData = false; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script> 
 
<body id="ng-app" ng-app> 
 
    <div ng-switch on="pdfData"> 
 
     <div ng-switch-when="false"></div> 
 
     <div ng-switch-when="true"> 
 
      <span class="font-10">Download Performance Report</span> 
 
      <a href="http://www.example.com/s-pdf/{{StudentPDFFile}}" target="_blank"> click here</a> 
 
     </div> 
 
    </div> 
 
</body>

在這裏我沒有指定控制器，這是骨架功能是爲我工作。

對於1000條記錄我怎麼能做到這一點？

來源

2014-10-09 Athi

告訴我redusing我點 – Athi 2014-10-09 10:16:32

的振振有辭如果啓動賞金是否需要在得到答案或不量從您的積分減少了不管。 – Wilgert 2014-10-21 07:52:46

只要您與pdf文件位於同一個域中，您就可以發起http請求以確定文件是否存在。

對於給定的學生證（在你的代碼似乎是response.student_id）它看起來像這樣：

if(response.student_id) { var url = 'http://www.example.com/s-pdf/' + response.student_id + '.pdf'; var request = new XMLHttpRequest(); request.open('HEAD', url, false); request.send(); if(request.status == 200) { $scope.pdfData = true; $scope.StudentPDFFile = response.student_id+'.pdf'; } else { $scope.pdfData = false; } } else { $scope.pdfData = false; }

的'HEAD'是一切必要，以確保該文件存在;你也可以使用'GET'，但在這種情況下似乎並不需要整個文件。

來源

2014-10-16 17:35:38 Luigi

它不起作用 – Athi 2014-10-17 06:25:07

request.send在request.send（）; alert（「hi」）;它沒有提醒任何東西。所以我的東西request.send有問題。請幫我 – Athi 2014-10-17 06:27:05

跨源請求被阻止：同源策略不允許讀鏈接處的遠程資源。這可以通過將資源移動到相同的域或啓用CORS來解決。 – Athi 2014-10-17 06:45:51

ng-show似乎更爲合適：

<div ng-show="pdfData"> 
    <span class="font-10">Download Performance Report</span> 
    <a href="http://www.example.com/s-pdf/{{StudentPDFFile}}" target="_blank"> click here</a> 
</div>

對於1000，把它放在一個ng-repeat那麼你應該更好，測試所有的PDF文件中的一個請求，並保存在緩存列表。

來源

2014-10-22 11:41:27 KyleK

它非常簡單的兄弟，你只需要使用ng-reapeat和ng-show。下面是我用小提琴例子的代碼，我希望它適合你。

HTML：

<div ng-app="studentApp"> 
    <h2>List of Students</h2> 
    <div ng-controller="studentController"> 

     <div ng-repeat="student in students"> 
      Student Name : <strong>{{student.name}}</strong><br> 
      <div ng-show="{{student.url}}"><a href="{{student.url}}" title="" >Download PDF</a><br></div> 
      <hr> 
     </div> 

    </div> 
</div>

JS：

angular.module('studentApp', []) 
    .controller('studentController', ['$scope', function($scope) { 
    $scope.students = [ 
     {name: 'John', url:'abc.com/files/1.pdf'}, 
     {name: 'Peter', url:''}, 
     {name: 'Kerry', url:'abc.com/files/1.pdf'}, 
     {name: 'Silly', url:'f'}, 
     ] 




    }]);

例子：http://jsfiddle.net/asadalikanwal/3a2zvrht/3/ 你只要改變PDF路徑一次。如果您有任何疑問拍攝

來源

2014-10-23 07:58:03

我有1000個記錄我不能硬編碼它 – Athi 2014-10-27 08:47:49

這是另一種方式。您可以製作一個指令並使用此指令驗證attrib，並在元素中設置所需的任何內容。

angular.module('myApp') 
.directive('imgCheck', ['$http', function($http){ 
     return { 
      link: function(scope, element, attrs){ 
       $http.get('/img/'+attrs.imgCheck) 
        .success(function(data, status){ 
         if(status==200){ 
          attrs.$set('src','/img/'+attrs.imgCheck) 
         }else{ 
          attrs.$set('src','/img/not-found.png') 
         } 
        }) 
        .error(function(data,status){ 
         if(status==200){ 
          attrs.$set('src','/img/'+attrs.imgCheck) 
         }else{ 
          attrs.$set('src','/img/not-found.png') 
         } 
        }); 
      } 
     };

}]）;

HTML

<figure class="podcast-item col-md-2" ng-repeat="image in images"> 
    <a href="#"> 
     <img class="img-thumbnail" img-check="{{image.url}}" /> 
    </a> 
</figure>

來源

2015-03-06 15:12:23 user2800430

使用AngularJS如何檢查文件夾中是否存在PDF文件？

回答

相關問題