Question

重复我无法运行href =＃所以我无法运行javascript函数。 a.click将打开toogle文本或a.click将关闭到Google文本。

JavaScript的：

<script>
$(".toggle-container").hide();
$(".trigger").toggle(function(){
    $(this).addClass("active");
    }, function () {
    $(this).removeClass("active");
});
$(".trigger").click(function(){
    $(this).next(".toggle-container").slideToggle();
});

$(".trigger.opened").toggle(function(){
    $(this).removeClass("active");
    }, function () {
    $(this).addClass("active");
});

$(".trigger.opened").addClass("active").next(".toggle-container").show();

toogle div：

        <div class="toggle-wrap" ng-repeat="question in questions">
            <span class="trigger opened"><a href="#"><i class="toggle-icon"></i>{{question.title}}</a></span>
            <div class="toggle-container" >
                <p>{{question.text}}</p>
            </div>
        </div>

Answer 1

可能最好不要使用jquery，只需使用angular，你有一个重复，所以你可以做这样的事情

Map<Integer, List<Obj>> objGroupBy = list.stream().collect(Collectors.groupingBy(Obj::getSomething)); 


List<Obj2> lst2= new ArrayList<Obj2>();

for (Entry<Integer, List<Obj>> entry : objGroupBy .entrySet())
{
    lst2.add(new Obj2(entry.getKey().intValue(), entry.getValue()));
}

删除任何可能影响此问题的css，或者如果你想坚持使用css类切换路由，并且你知道这些类如何打开和关闭，你可以使用相同的方法，除了更改

这个

 <div class="toggle-wrap" ng-repeat="question in questions">
        <span class="trigger opened" ng-click="openContainer = !openContainer"><a href="#"><i class="toggle-icon"></i>{{question.title}}</a></span>
        <div class="toggle-container" ng-show="openContainer">
            <p>{{question.text}}</p>
        </div>
</div>

到这个

 <div class="toggle-container" ng-show="openContainer">

只需更换“你的转换类”＆＃39;用你打开/关闭的任何课程。

Answer 2

使用ng-class指令代替所有jQuery，根据变量值切换元素类。

https://docs.angularjs.org/api/ng/directive/ngClass

要隐藏/显示元素，请使用ng-if和vairable值。 https://docs.angularjs.org/api/ng/directive/ngIf

Angular ng-repeat a href =＃和toogle无法正常工作

2 个答案: