0

以下に実際の例を示しますが、それは正しいアプローチではないと思います!

私の要件は次のとおりです。

  • 外部プラグインは使いたくない！
  • コントローラーを構文として使用する
  • タイプスクリプトを使用する

HTML:

<input type="file" name="file" onchange="angular.element(this).scope().uploadFile(this.files)" />

コントローラ：

module Test {
    export class TestController {
        MessageUpload: string;
        vm: any;

        static $inject = [ 'Factory','$state', '$scope'];

        constructor(private Factory:IFactory, private $state: ng.ui.IStateService, private $scope: any) {
            $scope.vm = this;
            $scope.uploadFile = this.uploadFile;
            this.vm = this;
        }

        /* ... */
        /* ... */
        /* ... */

        get(){/* .... */}

        uploadFile(files) {
            this.vm.MessageUpload = 'Uploading file. Please wait...';
            var fd = new FormData();
            fd.append('file', files[0]);

            this.vm.Factory.upload(fd).then((r) => {
                this.vm.MessageUpload = 'Completed ...';
                this.vm.get();
            });
        }
    }
}

最後のメモ:

  • in uploadFile():thisが参照されるので、 and$scopeにアクセスできるようにするには、どうにかしてコントローラー インスタンスを渡す必要があります。関数でもが参照されます。MessageUploadget()get()this$scope

thisこれをリファクタリングして、コントローラーへの参照としてアップロードおよび使用できるようにする方法を知っている人はいますか?

4

2 に答える 2

1

次の行を置き換えます: $scope.uploadfile = this.uploadFile;

$scope.uploadFile = (ファイル):void => this.uploadFile(file);

* スコープに関数を割り当てる方法は次のとおりです *

次の行を削除します: this.vm = this;

于 2015-09-17T16:33:50.827 に答える
0

onchange

角度のある世界 ( $digest) があり、外の世界 (v1少なくとも) があります。そのため、標準のイベント ハンドラだけを使用して何かを行うことはできません。

外部プラグインは使いたくない！

もちろん。次に、既に作成されている任意の数のプラグインからコードをコピーします。

于 2015-05-18T09:32:06.547 に答える