8

我们刚刚将 textangular 升级到 1.2.2,因为它现在支持拖放。

已经在 textAngualrSetup 中看到了 defaultFileDropHandler,但是,很难找到任何文档来支持它或如何使用它。

defaultFileDropHandler:
    /* istanbul ignore next: untestable image processing */
    function (file, insertAction)
    {
        debugger;
        var reader = new FileReader();
        if(file.type.substring(0, 5) === 'image'){
            reader.onload = function() {
                if(reader.result !== '') insertAction('insertImage', reader.result, true);
            };

            reader.readAsDataURL(file);
            return true;
        }
        return false;
    }

基本上,我们希望允许用户拖动多个 pdf、word 文档等并在提交时上传。

我们可以通过在设置页面中将功能添加到 defaultFileDropHandler 中的方式来实现此功能,

我们通过以下方式实现 ta:-

<div text-angular data-ng-model="NoteText" ></div>

但是,有没有更清洁的方法来实现这一目标?

4

2 回答 2

9

抱歉缺少文档!

基本上,当触发 HTMLelement.on("drop")事件时会触发 defaultFileDropHandler。

通过 textAngularSetup 文件实现这一点很好,但将全局应用于所有实例。要为 textAngular 的一个实例应用处理程序,请使用ta-file-drop属性,该属性应该是作用域上的函数名称,其签名与defaultFileDropHandler. 例如:

JS 在控制器中

$scope.dropHandler = function(file, insertAction){...};

HTML

<div text-angular data-ng-model="NoteText" ta-file-drop="dropHandler"></div>
于 2015-01-20T00:30:48.000 回答
3

两个很好的答案,谢谢!

我只想把完整的代码放出来以涵盖全球案例,因为代码只是一个片段......

app.config( function( $provide ) {
    $provide.decorator( 'taOptions', [ '$delegate', function( taOptions ) {

        taOptions.defaultFileDropHandler = function( file, insertAction ) {
            // validation
            if( file.type.substring( 0, 5 ) !== "image" ) {
                // add your own code here
                alert( "only images can be added" );
                return;
            }
            if( file.size > 500000 ) {
                // add your own code here
                alert( "file size cannot exceed 0.5MB" );
                return;
            }

            // create a base64 string
            var reader = new FileReader();
            reader.onload = function() {
                reader.result && insertAction( "insertImage", reader.result, true );
            };

            reader.readAsDataURL(file);
            return true;
        };

        return taOptions;
    }]);
});
于 2016-07-20T02:35:11.573 回答