问题标签 [ng-flow]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1173 浏览

angularjs - 拖放事件后如何停止 ng-flow 插件的上传操作

我正在使用基于 ng-flow 下载提供的简单图像上传示例的简单拖放效果。拖放工作正常,但我想停止默认上传操作,因为我想使用表单提交操作或使用 Angular.post()函数上传图像:

我尝试使用 event.preventDefault(); 在“fileAdded”和“filesSubmitted”事件处理程序中,但这不会停止上传开始事件。我想在表单提交过程中执行上传过程。

当我在“fileAdded”事件中使用“return false”时,根本不会插入图像。

但是,如果我在“filesSubmitted”事件处理程序中注入错误,脚本将失败,并且不会触发上传。但这不是实现这种效果的干净方法。

我也使用了这段代码,但它阻止了图像被添加到页面:

有关更多详细信息,请参阅下面的快照。

感谢您帮助解决此问题。

在此处输入图像描述 在此处输入图像描述

0 投票
1 回答
127 浏览

javascript - Javascript 表达式:对象数组;

我正在使用 ng-flow 示例进行基本图像上传。我看到了一个我不明白它是如何工作的表达式。

基本上,这是表达式:

如果数组在最后一个元素中具有有效图像,则上述方法似乎返回 true。我不知道为什么,但是在我研究了代码之后,这是我的结论。

感谢有人可以帮助我理解上述内容并给我一个文档链接。我到处搜索,但没有找到任何参考。

单击此处查看具有来自 ng-flow 的此表达式的 html

我认为代码的目的是在文件不是图像的情况下禁用文件的上传。

任何人都可以推荐和更简单的替代方案,请告诉我。

塔雷克

0 投票
1 回答
339 浏览

angularjs - 无法在一个 ng-flow 应用程序下上传两个单独的图像

我正在使用 ng-flow 文件上传:

https://github.com/flowjs/ng-flow

我的代码似乎有问题或有问题。我的工作基于下载提供的基本图像示例。

我正在尝试创建一个页面,允许使用一个应用程序和两个控制器上传两个图像。每张图片都是一张签名图片,一张给鉴定人,一张给主管。

无论我尝试什么,它都不起作用。

这两个图像中的每一个都有一个单独的放置区域,它们被视为一个图像。每次我将图像拖放到任何元素时,两者的文件预览都是相同的。

我试过用一个控制器,也用两个控制器,结果是一样的。一个图像将显示在两个元素上。

请参阅下面的快照和代码示例。

感谢你的帮助。

在此处输入图像描述

0 投票
1 回答
1137 浏览

javascript - 使用 FileList 拖放 AngularJs

我对前端开发非常陌生,我认为将拖放功能添加到当前上传页面会很酷。但是,在开始使用 ng-flow(一个辅助拖放的指令)连接所有内容后,我似乎无法就如何将文件添加到文件列表中建立联系。如果您认为我什至不需要该指令并且只是过度使用它并且有一个更简单的解决方案,我也愿意进行更改。注意:我只提供代码示例,所以不要因为不编译而对其进行修改!

文件模型指令:

文件方法

文件上传服务

html

0 投票
1 回答
190 浏览

javascript - 使用 ngFlow 以数据 uri 格式发送图像

我正在使用输入来加载图像,然后将其转换为数据 uri 格式以将其传递给ngImgCrop指令以裁剪该图像。

到目前为止,我已经完成了所有这些工作,但我正在努力尝试使用ngFlow上传数据 uri 格式的裁剪图像。

我已经尝试了几种方法都没有成功,有没有人能够做到这一点?

恐怕我遗漏了一些东西,我尝试使用该.addFile()方法并以数据 uri 格式传入图像,但它不能以这种方式工作。

0 投票
1 回答
213 浏览

javascript - ng-flow 抛出 404 错误

我是 symfony REST fromework 的新手。在我们的项目中,我们使用 ng-upload 来上传图片。下面是负责的代码。

// HTML

// 在控制器中(前端)

// 后端代码 - UnitController.php

//FlowJSHelper.php

我得到这样错误。

ng-flow-standalone.js:1249 GET http://localhost:30080/api/v1/units/5732fa2dec045be8448b457d/photos?flowChu …st1jpg&flowFilename=test1.jpg&flowRelativePath=test1.jpg&flowTotalChunks=1 404(未找到)

0 投票
1 回答
384 浏览

upload - 无法使用 ngFlow 将照片上传到具有跨域 (CORS) 的 URL

更新 1:允许在服务器端进行跨域访问。
更新 2:尝试使用禁用安全性的 chrome 上传。

target如果设置为同一域下的 URL,我成功使用了 ngFlow 。问题是有防火墙设置,上传随机失败,由于防火墙匹配特定模式的图像会阻止上传,并且图像不会发送到服务器。奇怪的是没有错误报告给客户端。上传刚刚停止。

根据网络管理员的说法,我们需要将上传提交到另一个域的不同 URL 以绕过防火墙。当我将target另一个域的绝对 URL 设置为绝对 URL 时,在执行上传过程时我在 Chrome 中收到此错误:

XMLHttpRequest 无法加载https://blabla/PhotoUploadCmd?imageOperation=u …tjpg&flowFilename=Desert.jpg&flowRelativePath=Desert.jpg&flowTotalChunks=1。对预检请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问源“ http://10.100.22.111:8282 ”。

这是配置 ng-flow 的代码部分:

请注意,防火墙问题仅发生在 UAT 机器上。如果我在本地 Tomcat 服务器上测试上传,它工作正常。

我还尝试了以下方法:

  • 在 JSP 上添加了以下代码行(它是加载内部框架的一部分),但仍然是相同的错误No 'Access-Control-Allow-Origin' header is present on the requested resource

编码:

  • 尝试在禁用安全性的情况下打开 chrome:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:\path-to-data-folder\Chrome"

使用上述方法,上传到不同的域,但 Chrome 显示警告You are using unsupported command-line flag...。不用说,这种方法不适合生产使用。

如果您知道如何解决防火墙问题,或者允许 ng-flow 执行上传并允许跨域访问,请告诉我。

塔雷克

0 投票
1 回答
471 浏览

javascript - 使用 flow.js 服务器上传文件得到响应 404

我使用 flow.js 将文件上传到服务器,目前我只上传一个文件并检查我的上传路线,如果我收到我发送的文件。

所以在角度方面我有这样的东西:

我毫无问题地注入了ng-flow模块,然后在我的角度控制器端我使用app.config,如下所示:

感觉这一方至少在工作,因为我从服务器端得到一个错误,这是我得到的错误:

最后我在我的路由器里得到了这个

如果有人能给我一个提示,为什么它会失败,我非常感激:D

0 投票
2 回答
1938 浏览

angularjs - Safari 中混合 AngularJS 和 Angular 应用程序的性能缓慢

我最近开始使用升级模块将 AngularJS 应用程序迁移到 Angular 4。

我的 AngularJS 指令之一使用第三方库 ( ngFlow ) 来使用XMLHttpRequest.send(). 在混合模式下运行时,上传在 Chrome 和 Firefox 中都可以正常工作。但是,在 Safari 中,应用程序在上传过程中变得非常缓慢,并且浏览器进程达到了 100% 的 CPU 使用率。

使用 Safari 网络工具,我看到有很多globalZoneAwareCallback来自 zone.js的调用。

我的印象是,Angular 区域正在为XMLHttpRequest上传期间发生的每个进度事件启动更改检测。

我知道我可以使用runOutsideAngularfromNgZone来避免这种情况,但我不知道如何在第三方 AngularJS 库中发生异步调用的情况下使用它,或者如果有任何其他解决方案来解决这个问题。

0 投票
1 回答
106 浏览

angularjs - 捕获取消文件选择 ng-flow 的事件:file-flow-error?

如果用户决定通过上传文件按钮使用 ng-flow 取消他们的文件选择,我正在尝试执行一些代码。我不知道如何捕捉这个事件

我尝试使用 flow-file-error 和 flow-error 指令无济于事。我传入的代码没有执行

我想找到一个解决方案,以便在通过弹出的外部窗口取消文件选择过程后能够执行功能。想法?