如何在AngularJS中通過ID獲取動態生成的ID？

Question

我正在生成如下列表

<div ng-repeat="list in fileUploadList">
    <div id="{{list}}Upload"></div>
</div>

在控制器內部，我必須通過ID獲取元素，所以我使用這一行：

document.getElementById($scope.fileUploadList[0] + 'Upload')

我將結果記錄到控制台但它返回null 。 我該怎么辦？

控制器中的功能

$scope.loadHandleImage = function () {

     console.log(document.getElementsById($scope.fileUploadList[0] + 'Upload'));
            for (var i = 0; i < $scope.fileUploadList.length; i++)
            {  
                document.getElementById($scope.fileUploadList[i] + 'Upload').addEventListener('change', handleImage, false);   
            }

其中handleImage是一個要調用的函數

Answer 1

當你試圖訪問元素使用angular.element（document）.ready方法時，我的問題文檔還沒有准備好

angular.element(document).ready(function() {
console.log(document.getElementById($scope.fileUploadList[0] + "Upload"))
});

這是工作示例http://jsfiddle.net/hqqewnyc/

Answer 2

采用

angular.element('#' + $scope.fileUploadList[0] + 'Upload').on('change', handleImage)

而不是document.getElementById和addEventListener

Answer 3

一個簡單的方法是（如果你不關心你的列表對象不在隨機id）

<div ng-repeat="list in fileUploadList" >
  <div id="{{$index}}Upload" ></div>
</div>

然后在控制器中獲取id

document.getElementById('0Upload')
document.getElementById('1Upload')

..等等

Answer 4

不是角度專家，但基於我的DOM經驗，有獲得ID屬性的方法。 我在普通javascript中的方式就在這里

str = "";
for(tmp=0;tmp<10;tmp++)
{
    str = str + "<div id='myid" + tmp + "' onclick='idofobject(\"myid" + id + "\")'>Click Me</div>";
}

我用DIV創建了html並動態地為它分配了一個像myid1 myid2等的id。每個div idofobject都有一個函數調用，它接受id

只是暗示可以有方法獲得對象的動態id

Answer 5

由於每個div都獲得動態ID，因此應使用父子關系獲取動態元素。 EX ：如果在div中添加2個按鈕，則動態獲取該div的第一個和第二個子以獲取每個按鈕。

Answer 6

而不是id在元素上使用類名，然后按類名獲取元素 - 這將為您提供某種類型的數組，然后您可以遍歷並從每個元素獲取您想要的任何屬性。