2016-12-11 44 views
0

我想实现文件保护程序,我想下载非常大的文本数据。我看到有一些图书馆已经提供诸如实现AngularJS文件保护程序下载大文本内容

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

回答

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); 
     }); 
});