Question

我使用了一个角度指令，我对jQlite .find（）方法没有任何好运：

指令

function cardsList () {
    return {
        restrict: 'A',
        controller: 'CardsController',
        templateUrl: 'app/directives/cards-list/cards-list.html',
        link: function ($scope, $element, attr, CardsController) {
                var cardLink = $element.find('a');

                console.log(cardLink);
            });

        }
    }
}

contextCards.directive('cardsList', cardsList);

在控制台上记录一个空的[]。

TEMPLATE

<li data-ng-repeat="card in cards" class="cards--item">
    <a class="cards--link" data-ng-href="#/{{ card.slug }}">{{ card.title }}</a>
</li>

查看

<ul class="col-xs-12 cards--list" cards-list></ul>

我想做的就是遍历<a>元素。根据{{3}}，.find()仅适用于标记名称，这正是我尝试做的。

编辑：如果选择了链接所代表的卡片（例如<a></a>）

，我想在.current-card添加一个班级

Answer 1

从您的回答中不清楚如何在模型中指定所选卡片，因此我假设card对象（每次迭代的对象{ {1}}）拥有此标志，例如：ng-repeat。

然后，您可以使用card.isSelected根据此值指定要添加的CSS类：

ng-class

<强>附录：

关于为什么<li ng-repeat="card in cards" class="cards--item"> <a class="cards--link" ng-class="{'current-card': card.isSelected}" ng-href="#/{{ card.slug }}">{{ card.title }}</a> </li>返回为空的原始问题的答案，这是因为.find("a")指令转换了它的内容（这意味着Angular在编译期间将元素从DOM中取出），并将其置于比ngRepeat功能更晚的阶段。

jQlite .find（）遍历不起作用

1 个答案: