實現AngularJS文件保護程序下載大文本內容

Question

我想實現文件保護程序，我想下載非常大的文本數據。我看到有一些圖書館已經提供諸如

Angular JS File Saver

<div class="wrapper" ng-controller="ExampleCtrl as vm"> 
    <textarea 
    ng-model="vm.val.text" 
    name="textarea" rows="5" cols="20"> 
     Hey ho let's go! 
    </textarea> 
    <a href="" class="btn btn-dark btn-small" ng-click="vm.download(vm.val.text)"> 
    Download 
    </a> 
</div> 

但我下架，我應該如何在我的AngularJS應用實現我不能。下面是我的應用程序的演示

這裏我使用data.json文件將數據放入UI中。我想保持一個下載按鈕，其中用戶點擊buttong用戶應該能夠下載本內容在data.json

Demo

Answer 1

必須使用包管理器首先安裝FileSaver（即鮑爾）進入項目，然後你可以在應用程序中使用它。

1）安裝FileSaver使用亭子安裝FileSaver到項目

2）定義FileSaver模塊

3）進樣FileSaver在目標控制器

後成功安裝庫，在app.js請更新您的密碼，如下所示：

// Define module here 
var app = angular.module('studentApp', ['FileSaver']); 

// Inject FileSaver into target controller 
app.controller('StudentCntrl', function($scope,$http, FileSaver) {  
    $scope.vm.download = function (data) { 
     if (!data) { 
     console.error('No data'); 
     return; 
     } 

     var newData = new Blob([data], { type: 'text/plain;charset=utf-8' }); 
     FileSaver.saveAs(newData, 'text.txt'); 
    }; 

    $http.get('data.json').then(function (response){ 
        console.log(response.data.pages); 
       $scope.data = response.data.PersonEvent.Body; 
       $scope.vm.download($scope.data); 
     }); 
});