angular view版本的angular jquery-fileupload示例?

时间:2017-03-15 15:27:31

标签: javascript jquery angularjs typescript jquery-file-upload

我正在尝试使用JQuery-FileUpload plugin应用程序中的AngularJS 1.6.2,此外还使用Typescript。我正在使用JQuery 1.12.4来使用该插件。

JQuery-FileUpload plugin页面包含一个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;
                    }
                );
        }
    }
])

我的打字稿尝试是:

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="">

1 个答案:

答案 0 :(得分:0)

这实际上不是因为使用了Typescript而是因为使用了较新版本的AngularJS即1.6.2,并且OP问题消失了,转而转向AngularJS版本1.3.15。