angular jquery-fileupload 示例的打字稿版本?

Typescript version of the angular jquery-fileupload example?

我正在尝试使用 JQuery-FileUpload plugin from an AngularJS 1.6.2 application that is in addition also using Typescript. I'm using JQuery 1.12.4 来使用该插件。

JQuery-FileUpload plugin page includes a Javascript AngularJS example app.js 和其中的 DemoFileUploadController 片段,我找不到如何使用 Typescript 使其工作:

.controller('DemoFileUploadController', [
    '$scope', '$http', '$filter', '$window',
    function ($scope, $http) {
        $scope.options = {
            url: url
        };
        if (!isOnGitHub) {
            $scope.loadingFiles = true;
            $http.get(url)
                .then(
                    function (response) {
                        $scope.loadingFiles = false;
                        $scope.queue = response.data.files || [];
                    },
                    function () {
                        $scope.loadingFiles = false;
                    }
                );
        }
    }
])

我的 Typescript 尝试是:

interface IUploadTSCtrlScope extends ng.IScope {
    options: any;
    queue: any;
    loadingFiles: boolean;

    // functions
    fileupload: any;
}

class UploadTSCtrl {
    constructor(private $scope:IUploadTSCtrlScope, private remoteServices: RemoteServices) {
        $scope.fileupload = function (url: string) {
            $scope.options = {
                url: url
            };
            $scope.loadingFiles = true;
            remoteServices.uploadFile(url)
                .then(
                    function (response: any) {
                        $scope.loadingFiles = false;
                        $scope.queue = response.data.files || [];
                    },
                    function () {
                        $scope.loadingFiles = false;
                    }
                );
        };
    }
}

但我总是在浏览器控制台中收到以下错误:

  TypeError: Object doesn't support property or method 'fileupload'
     at Anonymous function (http://localhost:9000/assets/js/jquery.fileupload-angular.js:282:17)
     at invoke (http://localhost:9000/assets/js/angular.js:4862:9)
     at $controllerInit (http://localhost:9000/assets/js/angular.js:10717:11)
     at nodeLinkFn (http://localhost:9000/assets/js/angular.js:9594:13)
     at compositeLinkFn (http://localhost:9000/assets/js/angular.js:8903:13)
     at compositeLinkFn (http://localhost:9000/assets/js/angular.js:8906:13)
     at compositeLinkFn (http://localhost:9000/assets/js/angular.js:8906:13)
     at publicLinkFn (http://localhost:9000/assets/js/angular.js:8768:30)
     at link (http://localhost:9000/assets/js/angular-route.js:1222:7)
     at Anonymous function (http://localhost:9000/assets/js/angular.js:1290:11) <div class="ng-scope" ng-view="">

这实际上不是因为 Typescript 而是由使用 AngularJS 的更新版本即 1.6.2 引起的,并且 OP 问题消失并切换到 AngularJS 版本 1.3.15。