Question

我正在开发我的第一个AngularJS应用程序，并遇到了jQuery查找功能的这个问题。基本上我要做的是，我有一个自定义的HTML组件。它包含使用ng-repeat指令的按钮列表。每个都有它自己的ng-click监听器，在它的回调中我想找到所有的app-item元素，但遗憾的是它只返回给我第一个。

我认为这是我应该使用链接的情况，但我不能自己来。

app-screen.html的一部分：

<div>    
    <div ng-repeat="error in _errorData.errors">
        <button class="app-item" ng-click="_onApplicationContainerClick($event)">
            <div class="col-xs-4">
                {{error.date}}
            </div>
            <div class="col-xs-4">
                {{error.errorID}}
            </div>
            <div class="col-xs-3">
                {{error.message}}
            </div>
            <div class="col-xs-1">
                <span class="glyphicon glyphicon-collapse-down"></span>
            </div>
        </button>
    </div>
</div>

AppScreen指令：

angular.module('ErrorViewer').directive('appScreen', function () {
    return {
        restrict: 'E',
        templateUrl: 'src/view/scene/app-screen.html',
        controller: 'AppScreenController'
    };
});

AppScreenController的一部分：

$scope._onApplicationContainerClick = function (e) {
    // some executions
    _collapseErrorData();
};

var _collapseErrorData = function () {
    var elems = $element.find( '.app-item' );
    // Should return array of ng-repeated elements!
}

Answer 1

在渲染阶段（正在执行$ watch处理程序时）呈现

ng-repeat。在编译和链接阶段，您只能访问模板。这就是你只看到一个元素的原因。

要挂钩渲染后阶段，可以使用$ timeout：

app.controller('AppScreenController', function($scope, $timeout) {
     var _collapseErrorData = function () {
        $timeout(function() {
            var elems = $element.find( '.app-item' );
            // Should return array of ng-repeated elements!
        });
     }
});

AngularJS ng-repeat jQuery find只返回一个元素

1 个答案: