AngularJS：将ng模型绑定到输入[type=file]会引发'；不再可用'；例外_Angularjs_Angularjs Ng Repeat

AngularJS：将ng模型绑定到输入[type=file]会引发'；不再可用'；例外

angularjs

AngularJS：将ng模型绑定到输入[type=file]会引发'；不再可用'；例外,angularjs,angularjs-ng-repeat,Angularjs,Angularjs Ng Repeat,使用此代码： <!doctype html> <html lang="en" ng-app="app"> <head> <meta charset="UTF-8"> <title>ngTest</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></sc

使用此代码：

<!doctype html>
<html lang="en" ng-app="app">
<head>
    <meta charset="UTF-8">
    <title>ngTest</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
    <script>
        angular
            .module('app', [])
            .controller('Main', ['$scope', function($s) {
                $s.data = {
                    level1: {
                        level2: {
                            elements: [{
                                name: 'item1'
                            },{
                                name: 'item2'
                            },{
                                name: 'item3'
                            },{
                                name: 'item4'
                            }]
                        }
                    }
                };
            }]);
    </script>
</head>
<body ng-controller="Main">
    <div ng-repeat="item in data.level1.level2.elements">
        <input type="file" ng-model="item.name">
    </div>
    <pre>{{data}}</pre>
</body>

只要将

type=“file”

更改为

type=“text”

，错误就会消失。你知道怎么解决这个问题吗？我将写一个指令，它将监听

更改

，甚至在输入上，上传给定文件并将其值分配给绑定模型。但我认为这个错误阻止了我这样做。最近几天我花了不少钱。如果您对此事有任何意见，我将不胜感激。

我只需使用

$scope.upload = function(el) {
  console.log(el.files);
};

我将其扩展为ng repeat的情况，所以您可以检查这个

不确定通过预填充文件输入可以做什么。这有什么好处？您没有原始文件对象，也没有预先填充输入，只是将绑定设置为模型。但是，我必须承认，它给了我一个创建包装器元素并向其添加绑定的想法，而不是当您设置

ng model

并且已经有了范围属性的值时，您实际上是在填充输入值…这在文件input上不起作用，我理解。但是，你能给我一个如何解决这个问题的建议吗？这样通过输入上传的文件（实际上是它的名字）就可以绑定到一个模型了？afaik ng模型对输入文件不起作用。如果您正在使用angular查找文件上载，请查看angular文件上载插件：轻量级，支持上载（适用于html5和非html5浏览器）、进度、取消/中止和拖放。要想让上传工作顺利进行有点棘手。它使用常规的$http发送文件

<input ng-model="file" onchange="angular.element(this).scope().upload(this)" type="file">

$scope.upload = function(el) {
  console.log(el.files);
};