AngularJS：結合NG-模型輸入[類型=文件]提出 '不再可用' 例外

使用此代碼：AngularJS：結合NG-模型輸入[類型=文件]提出 '不再可用' 例外

<!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>

將引發此錯誤：

Error: An attempt was made to use an object that is not, or is no longer, usable.

只要將type="file"更改爲type="text"，錯誤就會消失。任何想法如何解決這個問題？我要寫一個指令，即使在輸入時也會聽到change，上傳給定文件並將其值賦給綁定模型。但是，我的這個錯誤阻止了我這樣做。過去幾天我花了相當多的頭髮。任何關於此事的意見都將不勝感激。

來源

2013-10-29 Aleksandr Makov

不知道你指望通過預填充文件輸入做什麼。它會做什麼好？您沒有原始文件對象 – charlietfl

沒有預先填充輸入，只需設置綁定到模型。然而，我必須承認，它給了我一個想法，創建一個包裝元素並添加綁定到它，而不是輸入本身 –

當你設置'ng-model'並且已經有一個值範圍屬性你基本上是填充輸入值... coucln't在文件輸入工作 – charlietfl

對於單輸入我簡單地使用

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

然後我得到了我的控制器的功能訪問的文件列表並其發送到的FileReader例如

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

我延長它的NG-重複的情況下，所以你可以檢查此plunker

來源

2014-12-08 21:29:49 Qustion

AngularJS：結合NG-模型輸入[類型=文件]提出 '不再可用' 例外

回答

相關問題