Angularjs，在渲染後用ng-repeat做一些HTML元素UI

通過點擊「添加行」按鈕，使用AngularJS添加一行到HTML表格，只需執行像$ scope.photos.push（{}）之類的操作即可。。新行包含一個文件輸入字段，我想在新行被渲染後觸發文件輸入字段的文件對話框。這是可能的和如何？Angularjs，在渲染後用ng-repeat做一些HTML元素UI

.controller('mainController', function ($scope) { 
    $scope.photos = []; 
    $scope.addPhoto = function(){ 
    $scope.photos.push({}); 
    document.getElementById("photo" + $scope.photos.length-1).click(); // this won't work because the element is not yet rendered. 
    } 
});

HTML

<tr ng-repeat="photo in photos"> 
<td> <input type="file" id="photo{{ $index }}"> </td> 
</tr>

來源

2017-06-19 Raouf Athar

請包括一些代碼。 – 31piy

這是可能的。確保您生成的新行和它的數據存儲在數據庫中。 –

試試這個： - angular.element（document.querySelector（'＃id'））。click（）; –

順便說一句，我沒有看到你打電話$scope.$apply();在你的方法，以動態呈現的東西。

來源

2017-06-19 09:36:13 Artem

錯誤：$ rootScope：inprog 已執行操作 –

我的意思是，在將新照片推送到範圍之後，您需要重新計算範圍。 – Artem

是的，沒錯。這是錯誤發生的地方 –

使用$超時如下，它的工作原理：

.controller('mainController', function ($scope, $timeout) { 
    $scope.addPhoto = function(){ 
    $scope.photos.push({}); 
    $timeout(function(){ 
     document.getElementById("photo" + $scope.photos.length-1).click(); // this works now 
    }) 
    } 
});

來源

2017-06-20 05:18:49

Angularjs，在渲染後用ng-repeat做一些HTML元素UI

回答

相關問題