ng-model在文件输入中不起作用。

15 浏览
0 Comments

ng-model在文件输入中不起作用。

我正在尝试获取文件输入的值并在输入框之外的其他地方显示它。我在应用程序中使用的是AngularJS v1.4.8。


{{fileName}}

这种方法对于type="text"的情况很有效,但对于type="file"的情况不起作用。

为什么会这样,我该如何解决这个问题?

谢谢!

0
0 Comments

ng-model not working with file input 这个问题的出现的原因是 ng-model 指令不能直接用于文件输入(input type="file")元素。在这种情况下,ng-model 不会将文件的内容绑定到作用域中的变量。

解决方法是使用自定义指令来处理文件输入元素。上面提供的代码演示了如何创建一个名为 fileInput 的指令来处理文件输入。该指令使用 $parse 服务将文件的内容赋值给指定的作用域变量。

要使用该指令,只需将其添加到文件输入元素的属性列表中,并将目标作用域变量的名称传递给 file-input 属性。当用户选择文件时,指令会触发一个事件,并将文件的内容赋值给指定的作用域变量。

这个解决方法是从一个教程中获取的,该教程提供了一个更简单的方法来处理文件输入。上面的代码还展示了如何在界面上显示文件的名称。这个解决方法也适用于处理多个文件。

如果你想获取文件的缓冲数据和文件类型,可以使用 File API 提供的方法和属性来实现。这些方法和属性可以通过文件对象访问。例如,要获取文件的缓冲数据,可以使用文件对象的 readAsArrayBuffer() 方法。

希望这些信息对你有所帮助!

0