Angular File Upload bug fix (#268)

* initial fixes

* Update README.md

* Update README.md

* Update README.md

* read me updated

* read me updated

* code clean up
This commit is contained in:
Atish Kumar Dipongkor 2017-07-21 23:59:47 +06:00 committed by Vesa Juvonen
parent 54c391cecd
commit d44be59fbe
25 changed files with 499 additions and 464 deletions

View File

@ -3,11 +3,11 @@
## Summary
File Update/Delete webpart using AngularJs and ngOfficeUIFabric with the SharePoint Framework.
![File Upload using Angular](./assets/NG File Upload.png)
![File Upload using Angular](http://i.imgur.com/U5qg4II.png)
Edit webpart properties to set Document library Name. Initially, It has been set to `Documents`.
## Used SharePoint Framework Version
## Used SharePoint Framework Version
![drop](https://img.shields.io/badge/version-GA-green.svg)
## Applies to
@ -27,6 +27,7 @@ Version|Date|Comments
-------|----|--------
1.0|November 24, 2016|Initial release
2.0|May 26, 2017|GA release
2.1|July 19, 2017|Bug fix
## Disclaimer
**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**
@ -48,4 +49,4 @@ This Web Part illustrates the following concepts on top of the SharePoint Framew
- `CustomFileChange`: It's a custom Angular directive. It binds the file with model on file change event.
- `IsoToDateString`: It's a custom Angular filter. It formats ISO date string to `{0:yyyy}-{0:MM}-{0:dd}` format.
<img src="https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/angular-ngofficeuifabric-file-upload" />
<img src="https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/angular-ngofficeuifabric-file-upload" />

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
.angularFileUpload_fa6efb43 .container_fa6efb43{max-width:700px;margin:0 auto;box-shadow:0 2px 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1)}.angularFileUpload_fa6efb43 .row_fa6efb43{padding:20px}.angularFileUpload_fa6efb43 .listItem_fa6efb43{max-width:715px;margin:5px auto 5px auto;box-shadow:0 0 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1)}.angularFileUpload_fa6efb43 .button_fa6efb43{text-decoration:none}.angularFileUpload_fa6efb43 .headerBackground_fa6efb43{background:#006f94}.angularFileUpload_fa6efb43 .whiteBackground_fa6efb43{background:#fff}.angularFileUpload_fa6efb43 .textAlignCenter_fa6efb43{text-align:center}.angularFileUpload_fa6efb43 .cursorPointer_fa6efb43{cursor:pointer}
.angularFileUpload_18abd87a .container_18abd87a{max-width:700px;margin:0 auto;box-shadow:0 2px 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1)}.angularFileUpload_18abd87a .row_18abd87a{padding:20px}.angularFileUpload_18abd87a .listItem_18abd87a{max-width:715px;margin:5px auto 5px auto;box-shadow:0 0 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1)}.angularFileUpload_18abd87a .button_18abd87a{text-decoration:none}.angularFileUpload_18abd87a .headerBackground_18abd87a{background:#006f94}.angularFileUpload_18abd87a .whiteBackground_18abd87a{background:#fff}.angularFileUpload_18abd87a .textAlignCenter_18abd87a{text-align:center}.angularFileUpload_18abd87a .cursorPointer_18abd87a{cursor:pointer}

View File

@ -2,15 +2,15 @@
/* tslint:disable */
require('./AngularFileUpload.module.css');
var styles = {
angularFileUpload: 'angularFileUpload_fa6efb43',
container: 'container_fa6efb43',
row: 'row_fa6efb43',
listItem: 'listItem_fa6efb43',
button: 'button_fa6efb43',
headerBackground: 'headerBackground_fa6efb43',
whiteBackground: 'whiteBackground_fa6efb43',
textAlignCenter: 'textAlignCenter_fa6efb43',
cursorPointer: 'cursorPointer_fa6efb43',
angularFileUpload: 'angularFileUpload_18abd87a',
container: 'container_18abd87a',
row: 'row_18abd87a',
listItem: 'listItem_18abd87a',
button: 'button_18abd87a',
headerBackground: 'headerBackground_18abd87a',
whiteBackground: 'whiteBackground_18abd87a',
textAlignCenter: 'textAlignCenter_18abd87a',
cursorPointer: 'cursorPointer_18abd87a',
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = styles;

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/AngularFileUpload.module.scss.ts"],"names":[],"mappings":";AAAA,oBAAoB;AACpB,OAAO,CAAC,gCAAgC,CAAC,CAAC;AAC1C,IAAM,MAAM,GAAG;IACb,iBAAiB,EAAE,4BAA4B;IAC/C,SAAS,EAAE,oBAAoB;IAC/B,GAAG,EAAE,cAAc;IACnB,QAAQ,EAAE,mBAAmB;IAC7B,MAAM,EAAE,iBAAiB;IACzB,gBAAgB,EAAE,2BAA2B;IAC7C,eAAe,EAAE,0BAA0B;IAC3C,eAAe,EAAE,0BAA0B;IAC3C,aAAa,EAAE,wBAAwB;CACxC,CAAC;;AAEF,kBAAe,MAAM,CAAC;AACtB,mBAAmB","file":"webparts/angularFileUpload/AngularFileUpload.module.scss.js","sourcesContent":["/* tslint:disable */\r\nrequire('./AngularFileUpload.module.css');\r\nconst styles = {\r\n angularFileUpload: 'angularFileUpload_fa6efb43',\r\n container: 'container_fa6efb43',\r\n row: 'row_fa6efb43',\r\n listItem: 'listItem_fa6efb43',\r\n button: 'button_fa6efb43',\r\n headerBackground: 'headerBackground_fa6efb43',\r\n whiteBackground: 'whiteBackground_fa6efb43',\r\n textAlignCenter: 'textAlignCenter_fa6efb43',\r\n cursorPointer: 'cursorPointer_fa6efb43',\r\n};\r\n\r\nexport default styles;\r\n/* tslint:enable */"],"sourceRoot":"..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/AngularFileUpload.module.scss.ts"],"names":[],"mappings":";AAAA,oBAAoB;AACpB,OAAO,CAAC,gCAAgC,CAAC,CAAC;AAC1C,IAAM,MAAM,GAAG;IACb,iBAAiB,EAAE,4BAA4B;IAC/C,SAAS,EAAE,oBAAoB;IAC/B,GAAG,EAAE,cAAc;IACnB,QAAQ,EAAE,mBAAmB;IAC7B,MAAM,EAAE,iBAAiB;IACzB,gBAAgB,EAAE,2BAA2B;IAC7C,eAAe,EAAE,0BAA0B;IAC3C,eAAe,EAAE,0BAA0B;IAC3C,aAAa,EAAE,wBAAwB;CACxC,CAAC;;AAEF,kBAAe,MAAM,CAAC;AACtB,mBAAmB","file":"webparts/angularFileUpload/AngularFileUpload.module.scss.js","sourcesContent":["/* tslint:disable */\r\nrequire('./AngularFileUpload.module.css');\r\nconst styles = {\r\n angularFileUpload: 'angularFileUpload_18abd87a',\r\n container: 'container_18abd87a',\r\n row: 'row_18abd87a',\r\n listItem: 'listItem_18abd87a',\r\n button: 'button_18abd87a',\r\n headerBackground: 'headerBackground_18abd87a',\r\n whiteBackground: 'whiteBackground_18abd87a',\r\n textAlignCenter: 'textAlignCenter_18abd87a',\r\n cursorPointer: 'cursorPointer_18abd87a',\r\n};\r\n\r\nexport default styles;\r\n/* tslint:enable */"],"sourceRoot":"..\\..\\..\\src"}

View File

@ -1,11 +1,13 @@
import { Version } from '@microsoft/sp-core-library';
import { BaseClientSideWebPart, IPropertyPaneConfiguration, IWebPartContext } from '@microsoft/sp-webpart-base';
import './app/FileUploadModule';
import { IAngularFileUploadWebPartProps } from './IAngularFileUploadWebPartProps';
import 'ng-office-ui-fabric';
export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAngularFileUploadWebPartProps> {
context: IWebPartContext;
private $injector;
constructor(context: IWebPartContext);
render(): void;
protected initAngularApp(pageContext: any): void;
protected readonly dataVersion: Version;
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration;
protected readonly disableReactivePropertyChanges: boolean;

View File

@ -7,10 +7,15 @@ var __extends = (this && this.__extends) || function (d, b) {
var sp_core_library_1 = require("@microsoft/sp-core-library");
var sp_webpart_base_1 = require("@microsoft/sp-webpart-base");
var sp_loader_1 = require("@microsoft/sp-loader");
var angular = require("angular");
require("./app/FileUploadModule");
var AngularFileUpload_module_scss_1 = require("./AngularFileUpload.module.scss");
var strings = require("angularFileUploadStrings");
var angular = require("angular");
require("ng-office-ui-fabric");
var baseSvc_1 = require("./app/services/baseSvc");
var fileUploadSvc_1 = require("./app/services/fileUploadSvc");
var fileUploadCtrl_1 = require("./app/controllers/fileUploadCtrl");
var customFileChange_1 = require("./app/directives/customFileChange");
var isoToDateString_1 = require("./app/filters/isoToDateString");
var AngularFileUploadWebPart = (function (_super) {
__extends(AngularFileUploadWebPart, _super);
function AngularFileUploadWebPart(context) {
@ -22,13 +27,28 @@ var AngularFileUploadWebPart = (function (_super) {
AngularFileUploadWebPart.prototype.render = function () {
if (this.renderedOnce === false) {
this.domElement.innerHTML = "\n <div class=\"" + AngularFileUpload_module_scss_1.default.angularFileUpload + "\">\n <div class=\"" + AngularFileUpload_module_scss_1.default.container + "\" data-ng-controller=\"fileUploadCtrl as vm\">\n <div class=\"ms-Grid ms-fontColor-white " + AngularFileUpload_module_scss_1.default.row + " " + AngularFileUpload_module_scss_1.default.headerBackground + "\">\n <div class=\"ms-Grid-row\">\n <div class=\"ms-Grid-col ms-u-sm12 ms-u-md12 ms-u-lg12\">\n <h1 class=\"ms-fontSize-su ms-fontColor-white " + AngularFileUpload_module_scss_1.default.textAlignCenter + "\">Welcome to Angular File Upload!</h1>\n </div>\n </div>\n <div class=\"ms-Grid-row " + AngularFileUpload_module_scss_1.default.whiteBackground + " " + AngularFileUpload_module_scss_1.default.row + "\">\n <div class=\"ms-Grid-col ms-u-sm5 ms-u-md7 ms-u-lg7 ms-fontColor-black\"><input type=\"file\" value=\"vm.file.fileName\" data-custom-file-change=\"vm.file\" /></div>\n <div class=\"ms-Grid-col ms-u-sm2 ms-u-md2 ms-u-lg2\"><uif-spinner data-ng-if=\"vm.isUploading\"></uif-spinner></div>\n <div class=\"ms-Grid-col ms-u-sm5 ms-u-md3 ms-u-lg3\"><uif-button uif-type=\"primary\" data-ng-click=\"vm.upload()\">Upload</uif-button></div>\n </div>\n\n <div class=\"ms-Grid-row\">\n <div class=\"ms-Grid-col ms-u-sm12 ms-u-md12 ms-u-lg12\">\n <h1 class=\"ms-fontSize-su ms-fontColor-white " + AngularFileUpload_module_scss_1.default.textAlignCenter + "\">{{vm.libraryTitle}}: Files uploaded by You</h1>\n </div>\n </div>\n\n <div class=\"ms-Grid-row " + AngularFileUpload_module_scss_1.default.whiteBackground + " " + AngularFileUpload_module_scss_1.default.row + "\">\n <div class=\"ms-Grid-col ms-u-sm12 ms-u-md12 ms-u-lg12\">\n <uif-spinner data-ng-if=\"vm.isRemoving\">Removing .....</uif-spinner>\n </div>\n </div>\n\n <div class=\"ms-Grid-row " + AngularFileUpload_module_scss_1.default.whiteBackground + " " + AngularFileUpload_module_scss_1.default.row + "\">\n <div class=\"ms-Grid-col ms-u-sm12 ms-u-md12 ms-u-lg12\">\n <uif-table>\n <uif-table-head>\n <uif-table-row>\n <uif-table-header>File Name</uif-table-header>\n <uif-table-header>Modified</uif-table-header>\n <uif-table-header>Action</uif-table-header>\n </uif-table-row>\n </uif-table-head>\n <uif-table-body>\n <uif-table-row data-ng-repeat=\"fileItem in vm.allFiles\">\n <uif-table-cell>{{fileItem.FileLeafRef}}</uif-table-cell>\n <uif-table-cell>{{fileItem.Modified | isoToDateString}}</uif-table-cell>\n <uif-table-cell><i class=\"ms-Icon ms-Icon--Delete " + AngularFileUpload_module_scss_1.default.cursorPointer + "\" aria-hidden=\"true\" data-ng-click=\"vm.deleteFile(fileItem)\"></i></uif-table-cell>\n </uif-table-row>\n </uif-table-body>\n </uif-table>\n </div>\n </div>\n </div>\n </div>\n </div>";
this.$injector = angular.bootstrap(this.domElement, ['fileUploadApp']);
var context = this.context.pageContext;
this.initAngularApp(context);
}
this.$injector.get('$rootScope').$broadcast('configurationChanged', {
libraryTitle: this.properties.libraryTitle,
rowLimit: this.properties.rowLimit
});
};
AngularFileUploadWebPart.prototype.initAngularApp = function (pageContext) {
var fileUploadApp = angular.module('fileUploadApp', [
'officeuifabric.core',
'officeuifabric.components'
]);
fileUploadApp
.constant("pageContext", pageContext)
.service("baseService", baseSvc_1.BaseService)
.service("fileUploadService", fileUploadSvc_1.FileUploadService)
.controller("fileUploadCtrl", fileUploadCtrl_1.FileUploadCtrl)
.filter("isoToDateString", isoToDateString_1.IsoToDateString.filter)
.directive("customFileChange", customFileChange_1.CustomFileChange.factory());
this.$injector = angular.bootstrap(this.domElement, ['fileUploadApp']);
};
Object.defineProperty(AngularFileUploadWebPart.prototype, "dataVersion", {
get: function () {
return sp_core_library_1.Version.parse('1.0');

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/app/FileUploadModule.ts"],"names":[],"mappings":";AAAA,iCAAmC;AACnC,+BAA6B;AAC7B,8CAAiD;AACjD,0DAA6D;AAC7D,+DAA8D;AAC9D,kEAAiE;AACjE,6DAA4D;AAE5D,IAAM,aAAa,GAAe,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE;IAChE,qBAAqB;IACrB,2BAA2B;CAC5B,CAAC,CAAC;AAEH,aAAa;KACV,OAAO,CAAC,aAAa,EAAE,qBAAW,CAAC;KACnC,OAAO,CAAC,mBAAmB,EAAE,iCAAiB,CAAC;KAC/C,UAAU,CAAC,gBAAgB,EAAE,+BAAc,CAAC;KAC5C,MAAM,CAAC,iBAAiB,EAAE,iCAAe,CAAC,MAAM,CAAC;KACjD,SAAS,CAAC,kBAAkB,EAAE,mCAAgB,CAAC,OAAO,EAAE,CAAC,CAAC","file":"webparts/angularFileUpload/app/FileUploadModule.js","sourcesContent":["import * as angular from 'angular';\nimport 'ng-office-ui-fabric';\nimport { BaseService } from './services/baseSvc';\nimport { FileUploadService } from './services/fileUploadSvc';\nimport { FileUploadCtrl } from './controllers/fileUploadCtrl';\nimport { CustomFileChange } from './directives/customFileChange';\nimport { IsoToDateString } from './filters/isoToDateString';\n\nconst fileUploadApp: ng.IModule = angular.module('fileUploadApp', [\n 'officeuifabric.core',\n 'officeuifabric.components'\n]);\n\nfileUploadApp\n .service(\"baseService\", BaseService)\n .service(\"fileUploadService\", FileUploadService)\n .controller(\"fileUploadCtrl\", FileUploadCtrl)\n .filter(\"isoToDateString\", IsoToDateString.filter)\n .directive(\"customFileChange\", CustomFileChange.factory());\n\n"],"sourceRoot":"..\\..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/app/FileUploadModule.ts"],"names":[],"mappings":";AAAA,iCAAmC;AACnC,+BAA6B;AAC7B,8CAAiD;AACjD,0DAA6D;AAC7D,+DAA8D;AAC9D,kEAAiE;AACjE,6DAA4D;AAE5D,IAAM,aAAa,GAAe,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE;IAChE,qBAAqB;IACrB,2BAA2B;CAC5B,CAAC,CAAC;AAEH,aAAa;KACV,OAAO,CAAC,aAAa,EAAE,qBAAW,CAAC;KACnC,OAAO,CAAC,mBAAmB,EAAE,iCAAiB,CAAC;KAC/C,UAAU,CAAC,gBAAgB,EAAE,+BAAc,CAAC;KAC5C,MAAM,CAAC,iBAAiB,EAAE,iCAAe,CAAC,MAAM,CAAC;KACjD,SAAS,CAAC,kBAAkB,EAAE,mCAAgB,CAAC,OAAO,EAAE,CAAC,CAAC","file":"webparts/angularFileUpload/app/FileUploadModule.js","sourcesContent":["import * as angular from 'angular';\r\nimport 'ng-office-ui-fabric';\r\nimport { BaseService } from './services/baseSvc';\r\nimport { FileUploadService } from './services/fileUploadSvc';\r\nimport { FileUploadCtrl } from './controllers/fileUploadCtrl';\r\nimport { CustomFileChange } from './directives/customFileChange';\r\nimport { IsoToDateString } from './filters/isoToDateString';\r\n\r\nconst fileUploadApp: ng.IModule = angular.module('fileUploadApp', [\r\n 'officeuifabric.core',\r\n 'officeuifabric.components'\r\n]);\r\n\r\nfileUploadApp\r\n .service(\"baseService\", BaseService)\r\n .service(\"fileUploadService\", FileUploadService)\r\n .controller(\"fileUploadCtrl\", FileUploadCtrl)\r\n .filter(\"isoToDateString\", IsoToDateString.filter)\r\n .directive(\"customFileChange\", CustomFileChange.factory());\r\n\r\n"],"sourceRoot":"..\\..\\..\\..\\src"}

View File

@ -26,6 +26,9 @@ var FileUploadCtrl = (function () {
};
FileUploadCtrl.prototype.upload = function () {
var _this = this;
if (!this.file) {
return;
}
this.isUploading = true;
this.fileUploadService.uploadFile(this.libraryTitle, this.file)
.then(function (response) {

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/app/controllers/fileUploadCtrl.ts"],"names":[],"mappings":";AAKA;IASE,wBAAoB,iBAAoC,EAAU,UAAgC;QAAlG,iBAUC;QAVmB,sBAAiB,GAAjB,iBAAiB,CAAmB;QAAU,eAAU,GAAV,UAAU,CAAsB;QAH3F,gBAAW,GAAY,KAAK,CAAC;QAC7B,eAAU,GAAY,KAAK,CAAC;QAGjC,IAAM,EAAE,GAAmB,IAAI,CAAC;QAChC,UAAU,CAAC,GAAG,CAAC,sBAAsB,EACnC,UAAC,KAAuB,EAAE,IAAS;YACjC,KAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;YACtC,KAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YACxC,EAAE,CAAA,CAAC,KAAI,CAAC,YAAY,CAAC,CAAA,CAAC;gBACpB,KAAI,CAAC,IAAI,EAAE,CAAC;YACd,CAAC;QACH,CAAC,CAAC,CAAC;IACP,CAAC;IACO,6BAAI,GAAZ;QAAA,iBAOC;QANC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC;aAC9D,IAAI,CAAC,UAAC,QAA0B;YAC/B,KAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC3B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,+BAAM,GAAb;QAAA,iBAWC;QAVC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC;aAC5D,IAAI,CAAC,UAAC,QAAmB;YACxB,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;YAChC,KAAI,CAAC,IAAI,GAAG,IAAI,CAAC;YACjB,KAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAC3B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACrB,KAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAC3B,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,mCAAU,GAAjB,UAAkB,QAAmB;QAArC,iBAYC;QAXC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB;aACnB,UAAU,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,EAAE,CAAC;aAC1C,IAAI,CAAC,UAAC,QAAa;YAClB,IAAI,aAAa,GAAW,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;YAC5D,KAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC;YACvC,KAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACrB,KAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC,CAAC,CAAC;IACP,CAAC;IACH,qBAAC;AAAD,CAvDA,AAuDC;AAtDe,sBAAO,GAAa,CAAC,mBAAmB,EAAE,YAAY,CAAC,CAAC;AAD3D,wCAAc","file":"webparts/angularFileUpload/app/controllers/fileUploadCtrl.js","sourcesContent":["import { FileUploadService } from '../services/fileUploadSvc';\nimport { IFileItem } from \"../../interfaces/IFileItem\";\nimport { IFile } from \"../../interfaces/IFile\";\nimport { IError } from \"../../interfaces/IError\";\n\nexport class FileUploadCtrl {\n public static $inject: string[] = ['fileUploadService', '$rootScope'];\n public allFiles: Array<IFileItem>;\n public file: IFile;\n public libraryTitle: string;\n public rowLimit: number;\n public isUploading: boolean = false;\n public isRemoving: boolean = false;\n\n constructor(private fileUploadService: FileUploadService, private $rootScope: ng.IRootScopeService) {\n const vm: FileUploadCtrl = this;\n $rootScope.$on('configurationChanged',\n (event: ng.IAngularEvent, args: any): void => {\n this.libraryTitle = args.libraryTitle;\n this.rowLimit = parseInt(args.rowLimit);\n if(this.libraryTitle){\n this.init();\n }\n });\n }\n private init(): void {\n this.fileUploadService.getFiles(this.libraryTitle, this.rowLimit)\n .then((response: Array<IFileItem>): void => {\n this.allFiles = response;\n }, (error: IError): void => {\n alert(error.message);\n });\n }\n\n public upload(): void {\n this.isUploading = true;\n this.fileUploadService.uploadFile(this.libraryTitle, this.file)\n .then((response: IFileItem): void => {\n this.allFiles.unshift(response);\n this.file = null;\n this.isUploading = false;\n }, (error: IError): void => {\n alert(error.message);\n this.isUploading = false;\n });\n }\n\n public deleteFile(fileItem: IFileItem): void {\n this.isRemoving = true;\n this.fileUploadService\n .deleteFile(this.libraryTitle, fileItem.Id)\n .then((response: any): void => {\n var fileItemIndex: number = this.allFiles.indexOf(fileItem);\n this.allFiles.splice(fileItemIndex, 1);\n this.isRemoving = false;\n }, (error: IError): void => {\n alert(error.message);\n this.isRemoving = false;\n });\n }\n}\n"],"sourceRoot":"..\\..\\..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/app/controllers/fileUploadCtrl.ts"],"names":[],"mappings":";AAKA;IASE,wBAAoB,iBAAoC,EAAU,UAAgC;QAAlG,iBAUC;QAVmB,sBAAiB,GAAjB,iBAAiB,CAAmB;QAAU,eAAU,GAAV,UAAU,CAAsB;QAH3F,gBAAW,GAAY,KAAK,CAAC;QAC7B,eAAU,GAAY,KAAK,CAAC;QAGjC,IAAM,EAAE,GAAmB,IAAI,CAAC;QAChC,UAAU,CAAC,GAAG,CAAC,sBAAsB,EACnC,UAAC,KAAuB,EAAE,IAAS;YACjC,KAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;YACtC,KAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YACxC,EAAE,CAAA,CAAC,KAAI,CAAC,YAAY,CAAC,CAAA,CAAC;gBACpB,KAAI,CAAC,IAAI,EAAE,CAAC;YACd,CAAC;QACH,CAAC,CAAC,CAAC;IACP,CAAC;IACO,6BAAI,GAAZ;QAAA,iBAOC;QANC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC;aAC9D,IAAI,CAAC,UAAC,QAA0B;YAC/B,KAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC3B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,+BAAM,GAAb;QAAA,iBAcC;QAbC,EAAE,CAAA,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,CAAC;YACb,MAAM,CAAC;QACT,CAAC;QACD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC;aAC5D,IAAI,CAAC,UAAC,QAAmB;YACxB,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;YAChC,KAAI,CAAC,IAAI,GAAG,IAAI,CAAC;YACjB,KAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAC3B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACrB,KAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAC3B,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,mCAAU,GAAjB,UAAkB,QAAmB;QAArC,iBAYC;QAXC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB;aACnB,UAAU,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,EAAE,CAAC;aAC1C,IAAI,CAAC,UAAC,QAAa;YAClB,IAAI,aAAa,GAAW,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;YAC5D,KAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC;YACvC,KAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC,EAAE,UAAC,KAAa;YACf,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACrB,KAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC,CAAC,CAAC;IACP,CAAC;IACH,qBAAC;AAAD,CA1DA,AA0DC;AAzDe,sBAAO,GAAa,CAAC,mBAAmB,EAAE,YAAY,CAAC,CAAC;AAD3D,wCAAc","file":"webparts/angularFileUpload/app/controllers/fileUploadCtrl.js","sourcesContent":["import { FileUploadService } from '../services/fileUploadSvc';\r\nimport { IFileItem } from \"../../interfaces/IFileItem\";\r\nimport { IFile } from \"../../interfaces/IFile\";\r\nimport { IError } from \"../../interfaces/IError\";\r\n\r\nexport class FileUploadCtrl {\r\n public static $inject: string[] = ['fileUploadService', '$rootScope'];\r\n public allFiles: Array<IFileItem>;\r\n public file: IFile;\r\n public libraryTitle: string;\r\n public rowLimit: number;\r\n public isUploading: boolean = false;\r\n public isRemoving: boolean = false;\r\n\r\n constructor(private fileUploadService: FileUploadService, private $rootScope: ng.IRootScopeService) {\r\n const vm: FileUploadCtrl = this;\r\n $rootScope.$on('configurationChanged',\r\n (event: ng.IAngularEvent, args: any): void => {\r\n this.libraryTitle = args.libraryTitle;\r\n this.rowLimit = parseInt(args.rowLimit);\r\n if(this.libraryTitle){\r\n this.init();\r\n }\r\n });\r\n }\r\n private init(): void {\r\n this.fileUploadService.getFiles(this.libraryTitle, this.rowLimit)\r\n .then((response: Array<IFileItem>): void => {\r\n this.allFiles = response;\r\n }, (error: IError): void => {\r\n alert(error.message);\r\n });\r\n }\r\n\r\n public upload(): void {\r\n if(!this.file){\r\n return;\r\n }\r\n this.isUploading = true;\r\n this.fileUploadService.uploadFile(this.libraryTitle, this.file)\r\n .then((response: IFileItem): void => {\r\n this.allFiles.unshift(response);\r\n this.file = null;\r\n this.isUploading = false;\r\n }, (error: IError): void => {\r\n alert(error.message);\r\n this.isUploading = false;\r\n });\r\n }\r\n\r\n public deleteFile(fileItem: IFileItem): void {\r\n this.isRemoving = true;\r\n this.fileUploadService\r\n .deleteFile(this.libraryTitle, fileItem.Id)\r\n .then((response: any): void => {\r\n var fileItemIndex: number = this.allFiles.indexOf(fileItem);\r\n this.allFiles.splice(fileItemIndex, 1);\r\n this.isRemoving = false;\r\n }, (error: IError): void => {\r\n alert(error.message);\r\n this.isRemoving = false;\r\n });\r\n }\r\n}\r\n"],"sourceRoot":"..\\..\\..\\..\\..\\src"}

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/app/directives/customFileChange.ts"],"names":[],"mappings":";AACA;IACE,0BAAoB,MAAwB;QAA5C,iBAEC;QAFmB,WAAM,GAAN,MAAM,CAAkB;QAItC,aAAQ,GAAG,GAAG,CAAC;QACf,SAAI,GAAG,UAAC,KAAgB,EAAE,OAAY,EAAE,KAAU;YACtD,IAAM,KAAK,GAAG,KAAI,CAAC,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;YAClD,IAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;YACjC,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE;gBACrB,KAAK,CAAC,MAAM,CAAC;oBACX,IAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;oBAEhC,MAAM,CAAC,MAAM,GAAG,UAAC,KAAU;wBACzB,IAAM,SAAS,GAAU;4BACvB,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;4BAClC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM;yBAClC,CAAC;wBACF,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;oBAChC,CAAC,CAAC;oBAEF,MAAM,CAAC,OAAO,GAAG,UAAC,KAAU;wBAC1B,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;oBAC5B,CAAC,CAAC;oBACF,MAAM,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;gBAChD,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;IAxBF,CAAC;IA0BY,wBAAO,GAArB;QACG,IAAM,SAAS,GAAG,UAAC,MAAwB,IAAK,OAAA,IAAI,gBAAgB,CAAC,MAAM,CAAC,EAA5B,CAA4B,CAAC;QAC7E,SAAS,CAAC,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC/B,MAAM,CAAC,SAAS,CAAC;IACnB,CAAC;IACH,uBAAC;AAAD,CAlCA,AAkCC,IAAA;AAlCY,4CAAgB","file":"webparts/angularFileUpload/app/directives/customFileChange.js","sourcesContent":["import { IFile } from \"../../interfaces/IFile\";\nexport class CustomFileChange implements ng.IDirective {\n constructor(private $parse: ng.IParseService) {\n\n }\n\n public restrict = \"A\";\n public link = (scope: ng.IScope, element: any, attrs: any) => {\n const model = this.$parse(attrs.customFileChange);\n const modelSetter = model.assign;\n element.bind(\"change\", (): void => {\n scope.$apply((): void => {\n const reader = new FileReader();\n\n reader.onload = (event: any): void => {\n const fileModel: IFile = {\n fileName: element[0].files[0].name, \n fileAsBuffer: event.target.result\n };\n modelSetter(scope, fileModel);\n };\n\n reader.onerror = (event: any): void => {\n alert(event.target.error);\n };\n reader.readAsArrayBuffer(element[0].files[0]);\n });\n });\n };\n\n public static factory(): ng.IDirectiveFactory {\n const directive = ($parse: ng.IParseService) => new CustomFileChange($parse);\n directive.$inject = ['$parse'];\n return directive;\n }\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/app/directives/customFileChange.ts"],"names":[],"mappings":";AACA;IACE,0BAAoB,MAAwB;QAA5C,iBAEC;QAFmB,WAAM,GAAN,MAAM,CAAkB;QAItC,aAAQ,GAAG,GAAG,CAAC;QACf,SAAI,GAAG,UAAC,KAAgB,EAAE,OAAY,EAAE,KAAU;YACtD,IAAM,KAAK,GAAG,KAAI,CAAC,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;YAClD,IAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;YACjC,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE;gBACrB,KAAK,CAAC,MAAM,CAAC;oBACX,IAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;oBAEhC,MAAM,CAAC,MAAM,GAAG,UAAC,KAAU;wBACzB,IAAM,SAAS,GAAU;4BACvB,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;4BAClC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM;yBAClC,CAAC;wBACF,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;oBAChC,CAAC,CAAC;oBAEF,MAAM,CAAC,OAAO,GAAG,UAAC,KAAU;wBAC1B,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;oBAC5B,CAAC,CAAC;oBACF,MAAM,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;gBAChD,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;IAxBF,CAAC;IA0BY,wBAAO,GAArB;QACG,IAAM,SAAS,GAAG,UAAC,MAAwB,IAAK,OAAA,IAAI,gBAAgB,CAAC,MAAM,CAAC,EAA5B,CAA4B,CAAC;QAC7E,SAAS,CAAC,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC/B,MAAM,CAAC,SAAS,CAAC;IACnB,CAAC;IACH,uBAAC;AAAD,CAlCA,AAkCC,IAAA;AAlCY,4CAAgB","file":"webparts/angularFileUpload/app/directives/customFileChange.js","sourcesContent":["import { IFile } from \"../../interfaces/IFile\";\r\nexport class CustomFileChange implements ng.IDirective {\r\n constructor(private $parse: ng.IParseService) {\r\n\r\n }\r\n\r\n public restrict = \"A\";\r\n public link = (scope: ng.IScope, element: any, attrs: any) => {\r\n const model = this.$parse(attrs.customFileChange);\r\n const modelSetter = model.assign;\r\n element.bind(\"change\", (): void => {\r\n scope.$apply((): void => {\r\n const reader = new FileReader();\r\n\r\n reader.onload = (event: any): void => {\r\n const fileModel: IFile = {\r\n fileName: element[0].files[0].name, \r\n fileAsBuffer: event.target.result\r\n };\r\n modelSetter(scope, fileModel);\r\n };\r\n\r\n reader.onerror = (event: any): void => {\r\n alert(event.target.error);\r\n };\r\n reader.readAsArrayBuffer(element[0].files[0]);\r\n });\r\n });\r\n };\r\n\r\n public static factory(): ng.IDirectiveFactory {\r\n const directive = ($parse: ng.IParseService) => new CustomFileChange($parse);\r\n directive.$inject = ['$parse'];\r\n return directive;\r\n }\r\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/app/filters/isoToDateString.ts"],"names":[],"mappings":";AAAA;IAAA;IAMA,CAAC;IALc,sBAAM,GAApB;QACG,MAAM,CAAC,UAAC,KAAa;YACnB,MAAM,CAAO,MAAO,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QACzE,CAAC,CAAC;IACJ,CAAC;IACH,sBAAC;AAAD,CANA,AAMC,IAAA;AANY,0CAAe","file":"webparts/angularFileUpload/app/filters/isoToDateString.js","sourcesContent":["export class IsoToDateString {\n public static filter() {\n return (value: string): string => {\n return (<any>String).format(\"{0:yyyy}-{0:MM}-{0:dd}\", new Date(value));\n };\n }\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/app/filters/isoToDateString.ts"],"names":[],"mappings":";AAAA;IAAA;IAMA,CAAC;IALc,sBAAM,GAApB;QACG,MAAM,CAAC,UAAC,KAAa;YACnB,MAAM,CAAO,MAAO,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QACzE,CAAC,CAAC;IACJ,CAAC;IACH,sBAAC;AAAD,CANA,AAMC,IAAA;AANY,0CAAe","file":"webparts/angularFileUpload/app/filters/isoToDateString.js","sourcesContent":["export class IsoToDateString {\r\n public static filter() {\r\n return (value: string): string => {\r\n return (<any>String).format(\"{0:yyyy}-{0:MM}-{0:dd}\", new Date(value));\r\n };\r\n }\r\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}

View File

@ -1,9 +1,10 @@
export declare class BaseService {
private $http;
private $q;
private pageContext;
static $inject: string[];
baseUrl: string;
constructor($http: ng.IHttpService, $q: ng.IQService);
constructor($http: ng.IHttpService, $q: ng.IQService, pageContext: any);
getRequest(query?: string, endPoint?: string): ng.IPromise<any>;
postRequest(url: string, requestBody: any, endPoint?: string): ng.IPromise<any>;
updateRequest(url: string, requestBody: any, eTag: string, endPoint?: string): ng.IPromise<{}>;

View File

@ -1,10 +1,11 @@
"use strict";
var angular = require("angular");
var BaseService = (function () {
function BaseService($http, $q) {
function BaseService($http, $q, pageContext) {
this.$http = $http;
this.$q = $q;
this.baseUrl = window._spPageContextInfo.webAbsoluteUrl;
this.pageContext = pageContext;
this.baseUrl = pageContext.web.absoluteUrl;
}
BaseService.prototype.getRequest = function (query, endPoint) {
var deferred = this.$q.defer();
@ -172,7 +173,7 @@ var BaseService = (function () {
};
return BaseService;
}());
BaseService.$inject = ["$http", "$q"];
BaseService.$inject = ["$http", "$q", "pageContext"];
exports.BaseService = BaseService;
//# sourceMappingURL=BaseSvc.js.map
//# sourceMappingURL=baseSvc.js.map

View File

@ -1,4 +1,4 @@
import { BaseService } from "./BaseSvc";
import { BaseService } from "./baseSvc";
import { IFileItem } from "../../interfaces/IFileItem";
import { IFile } from "../../interfaces/IFile";
export declare class FileUploadService {

View File

@ -21,7 +21,7 @@ var FileUploadService = (function () {
return deferred.promise;
};
FileUploadService.prototype.getFiles = function (libraryName, rowLimit) {
var url = "/_api/Web/lists/getbytitle('" + libraryName + "')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=" + rowLimit + "&$filter=Author/Id eq " + window._spPageContextInfo.userId;
var url = "/_api/Web/lists/getbytitle('" + libraryName + "')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=" + rowLimit;
return this.baseService.getRequest(url);
};
FileUploadService.prototype.deleteFile = function (libraryName, id) {

View File

@ -1 +1 @@
{"version":3,"sources":["webparts/angularFileUpload/app/services/fileUploadSvc.ts"],"names":[],"mappings":";AAIA;IAEE,2BAAoB,WAAwB,EAAU,EAAgB;QAAlD,gBAAW,GAAX,WAAW,CAAa;QAAU,OAAE,GAAF,EAAE,CAAc;IACtE,CAAC;IAEM,sCAAU,GAAjB,UAAkB,WAAmB,EAAE,IAAW;QAAlD,iBAcC;QAbC,IAAM,QAAQ,GAA4B,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;QAC1D,IAAI,SAAS,GAAG,iCAA+B,WAAW,0EAAqE,IAAI,CAAC,QAAQ,MAAG,CAAC;QAChJ,IAAI,CAAC,WAAW;aACb,WAAW,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC;aACzC,IAAI,CAAC,UAAC,QAAa;YAClB,MAAM,CAAC,KAAI,CAAC,WAAW;iBACpB,UAAU,CAAC,IAAI,EAAK,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,UAAU,CAAC,GAAG,qCAAkC,CAAC,CAAC;QACxG,CAAC,CAAC,CAAC,IAAI,CAAC,UAAC,QAAmB;YAC1B,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAC7B,CAAC,EAAE,UAAC,KAAU;YACZ,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;QACL,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC;IAC1B,CAAC;IAEM,oCAAQ,GAAf,UAAgB,WAAmB,EAAE,QAAgB;QACnD,IAAM,GAAG,GAAW,iCAA+B,WAAW,sGAAiG,QAAQ,8BAA+B,MAAO,CAAC,kBAAkB,CAAC,MAAQ,CAAC;QAC1O,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;IAC1C,CAAC;IAEM,sCAAU,GAAjB,UAAkB,WAAmB,EAAE,EAAU;QAC/C,IAAM,GAAG,GAAW,iCAA+B,WAAW,iBAAY,EAAE,MAAG,CAAC;QAChF,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IAClD,CAAC;IACH,wBAAC;AAAD,CA9BA,AA8BC;AA7Be,yBAAO,GAAa,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;AAD7C,8CAAiB","file":"webparts/angularFileUpload/app/services/fileUploadSvc.js","sourcesContent":["import { BaseService } from \"./BaseSvc\";\nimport { IFileItem } from \"../../interfaces/IFileItem\";\nimport { IFile } from \"../../interfaces/IFile\";\n\nexport class FileUploadService {\n public static $inject: string[] = [\"baseService\", \"$q\"];\n constructor(private baseService: BaseService, private $q: ng.IQService) {\n }\n\n public uploadFile(libraryName: string, file: IFile): ng.IPromise<IFileItem> {\n const deferred: ng.IDeferred<IFileItem> = this.$q.defer();\n var uploadUrl = `/_api/web/lists/getbytitle('${libraryName}')/rootfolder/files/add(url=@filename, overwrite=true)?@filename='${file.fileName}'`;\n this.baseService\n .postRequest(uploadUrl, file.fileAsBuffer)\n .then((response: any): ng.IPromise<IFileItem> => {\n return this.baseService\n .getRequest(null, `${response.d.ListItemAllFields.__deferred.uri}?$select=Id,Modified,FileLeafRef`);\n }).then((response: IFileItem): void => {\n deferred.resolve(response);\n }, (error: any): void => {\n deferred.reject(error);\n });\n return deferred.promise;\n }\n\n public getFiles(libraryName: string, rowLimit: number): ng.IPromise<Array<IFileItem>> {\n const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=${rowLimit}&$filter=Author/Id eq ${(<any>window)._spPageContextInfo.userId}`;\n return this.baseService.getRequest(url);\n }\n\n public deleteFile(libraryName: string, id: number): ng.IPromise<any> {\n const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items(${id})`;\n return this.baseService.deleteRequest(url, \"*\");\n }\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}
{"version":3,"sources":["webparts/angularFileUpload/app/services/fileUploadSvc.ts"],"names":[],"mappings":";AAIA;IAEE,2BAAoB,WAAwB,EAAU,EAAgB;QAAlD,gBAAW,GAAX,WAAW,CAAa;QAAU,OAAE,GAAF,EAAE,CAAc;IACtE,CAAC;IAEM,sCAAU,GAAjB,UAAkB,WAAmB,EAAE,IAAW;QAAlD,iBAcC;QAbC,IAAM,QAAQ,GAA4B,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;QAC1D,IAAI,SAAS,GAAG,iCAA+B,WAAW,0EAAqE,IAAI,CAAC,QAAQ,MAAG,CAAC;QAChJ,IAAI,CAAC,WAAW;aACb,WAAW,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC;aACzC,IAAI,CAAC,UAAC,QAAa;YAClB,MAAM,CAAC,KAAI,CAAC,WAAW;iBACpB,UAAU,CAAC,IAAI,EAAK,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,UAAU,CAAC,GAAG,qCAAkC,CAAC,CAAC;QACxG,CAAC,CAAC,CAAC,IAAI,CAAC,UAAC,QAAmB;YAC1B,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAC7B,CAAC,EAAE,UAAC,KAAU;YACZ,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;QACL,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC;IAC1B,CAAC;IAEM,oCAAQ,GAAf,UAAgB,WAAmB,EAAE,QAAgB;QACnD,IAAM,GAAG,GAAW,iCAA+B,WAAW,sGAAiG,QAAU,CAAC;QAC1K,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;IAC1C,CAAC;IAEM,sCAAU,GAAjB,UAAkB,WAAmB,EAAE,EAAU;QAC/C,IAAM,GAAG,GAAW,iCAA+B,WAAW,iBAAY,EAAE,MAAG,CAAC;QAChF,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IAClD,CAAC;IACH,wBAAC;AAAD,CA9BA,AA8BC;AA7Be,yBAAO,GAAa,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;AAD7C,8CAAiB","file":"webparts/angularFileUpload/app/services/fileUploadSvc.js","sourcesContent":["import { BaseService } from \"./baseSvc\";\r\nimport { IFileItem } from \"../../interfaces/IFileItem\";\r\nimport { IFile } from \"../../interfaces/IFile\";\r\n\r\nexport class FileUploadService {\r\n public static $inject: string[] = [\"baseService\", \"$q\"];\r\n constructor(private baseService: BaseService, private $q: ng.IQService) {\r\n }\r\n\r\n public uploadFile(libraryName: string, file: IFile): ng.IPromise<IFileItem> {\r\n const deferred: ng.IDeferred<IFileItem> = this.$q.defer();\r\n var uploadUrl = `/_api/web/lists/getbytitle('${libraryName}')/rootfolder/files/add(url=@filename, overwrite=true)?@filename='${file.fileName}'`;\r\n this.baseService\r\n .postRequest(uploadUrl, file.fileAsBuffer)\r\n .then((response: any): ng.IPromise<IFileItem> => {\r\n return this.baseService\r\n .getRequest(null, `${response.d.ListItemAllFields.__deferred.uri}?$select=Id,Modified,FileLeafRef`);\r\n }).then((response: IFileItem): void => {\r\n deferred.resolve(response);\r\n }, (error: any): void => {\r\n deferred.reject(error);\r\n });\r\n return deferred.promise;\r\n }\r\n\r\n public getFiles(libraryName: string, rowLimit: number): ng.IPromise<Array<IFileItem>> {\r\n const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=${rowLimit}`;\r\n return this.baseService.getRequest(url);\r\n }\r\n\r\n public deleteFile(libraryName: string, id: number): ng.IPromise<any> {\r\n const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items(${id})`;\r\n return this.baseService.deleteRequest(url, \"*\");\r\n }\r\n}"],"sourceRoot":"..\\..\\..\\..\\..\\src"}

View File

@ -7,16 +7,21 @@ import {
} from '@microsoft/sp-webpart-base';
import { escape } from '@microsoft/sp-lodash-subset';
import { SPComponentLoader } from '@microsoft/sp-loader';
import * as angular from 'angular';
import './app/FileUploadModule';
import styles from './AngularFileUpload.module.scss';
import * as strings from 'angularFileUploadStrings';
import { IAngularFileUploadWebPartProps } from './IAngularFileUploadWebPartProps';
export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAngularFileUploadWebPartProps> {
import * as angular from 'angular';
import 'ng-office-ui-fabric';
import { BaseService } from './app/services/baseSvc';
import { FileUploadService } from './app/services/fileUploadSvc';
import { FileUploadCtrl } from './app/controllers/fileUploadCtrl';
import { CustomFileChange } from './app/directives/customFileChange';
import { IsoToDateString } from './app/filters/isoToDateString';
export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAngularFileUploadWebPartProps> {
public context: IWebPartContext;
private $injector: ng.auto.IInjectorService;
public constructor(context: IWebPartContext) {
super();
@ -25,6 +30,7 @@ export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAng
}
public render(): void {
if (this.renderedOnce === false) {
this.domElement.innerHTML = `
<div class="${styles.angularFileUpload}">
@ -76,8 +82,9 @@ export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAng
</div>
</div>
</div>`;
var context = this.context.pageContext;
this.$injector = angular.bootstrap(this.domElement, ['fileUploadApp']);
this.initAngularApp(context);
}
this.$injector.get('$rootScope').$broadcast('configurationChanged', {
libraryTitle: this.properties.libraryTitle,
@ -85,6 +92,24 @@ export default class AngularFileUploadWebPart extends BaseClientSideWebPart<IAng
});
}
protected initAngularApp(pageContext: any) {
const fileUploadApp: ng.IModule = angular.module('fileUploadApp', [
'officeuifabric.core',
'officeuifabric.components'
]);
fileUploadApp
.constant("pageContext", pageContext)
.service("baseService", BaseService)
.service("fileUploadService", FileUploadService)
.controller("fileUploadCtrl", FileUploadCtrl)
.filter("isoToDateString", IsoToDateString.filter)
.directive("customFileChange", CustomFileChange.factory());
this.$injector = angular.bootstrap(this.domElement, ['fileUploadApp']);
}
protected get dataVersion(): Version {
return Version.parse('1.0');
}

View File

@ -1,20 +0,0 @@
import * as angular from 'angular';
import 'ng-office-ui-fabric';
import { BaseService } from './services/baseSvc';
import { FileUploadService } from './services/fileUploadSvc';
import { FileUploadCtrl } from './controllers/fileUploadCtrl';
import { CustomFileChange } from './directives/customFileChange';
import { IsoToDateString } from './filters/isoToDateString';
const fileUploadApp: ng.IModule = angular.module('fileUploadApp', [
'officeuifabric.core',
'officeuifabric.components'
]);
fileUploadApp
.service("baseService", BaseService)
.service("fileUploadService", FileUploadService)
.controller("fileUploadCtrl", FileUploadCtrl)
.filter("isoToDateString", IsoToDateString.filter)
.directive("customFileChange", CustomFileChange.factory());

View File

@ -33,6 +33,9 @@ export class FileUploadCtrl {
}
public upload(): void {
if(!this.file){
return;
}
this.isUploading = true;
this.fileUploadService.uploadFile(this.libraryTitle, this.file)
.then((response: IFileItem): void => {

View File

@ -1,15 +1,15 @@
import { IError } from "../../interfaces/IError";
import * as angular from 'angular';
import { IWebPartContext } from '@microsoft/sp-webpart-base';
import { ServiceKey, ServiceScope } from '@microsoft/sp-core-library';
export class BaseService {
public static $inject: string[] = ["$http", "$q"];
public static $inject: string[] = ["$http", "$q", "pageContext"];
public baseUrl: string;
constructor(private $http: ng.IHttpService, private $q: ng.IQService) {
this.baseUrl = (<any>window)._spPageContextInfo.webAbsoluteUrl;
constructor(private $http: ng.IHttpService, private $q: ng.IQService, private pageContext:any) {
this.baseUrl = pageContext.web.absoluteUrl;
}
public getRequest(query?: string, endPoint?: string): ng.IPromise<any> {

View File

@ -1,4 +1,4 @@
import { BaseService } from "./BaseSvc";
import { BaseService } from "./baseSvc";
import { IFileItem } from "../../interfaces/IFileItem";
import { IFile } from "../../interfaces/IFile";
@ -24,7 +24,7 @@ export class FileUploadService {
}
public getFiles(libraryName: string, rowLimit: number): ng.IPromise<Array<IFileItem>> {
const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=${rowLimit}&$filter=Author/Id eq ${(<any>window)._spPageContextInfo.userId}`;
const url: string = `/_api/Web/lists/getbytitle('${libraryName}')/items?$select=Id,Modified,FileLeafRef,Author/Id&$expand=Author&$orderby=Modified desc&$top=${rowLimit}`;
return this.baseService.getRequest(url);
}