角度,如何将class设置为单击列表项并从其他li项中删除?

史密斯

我在尝试将class设置为clicked列表项的地方有此列表(但应该仅为clicked item设置class)。

我尝试通过这种方式但没有运气:

<a href="" 
   ng-ctrl="ThemesCtrl" 
   ng-click="checkThemeContent(theme);" 
   ng-repeat="theme in themes" 
   ng-hide="theme[filterProp] !== filterValue" 
   class="list-group-item">
    <b>{{theme.name}}</b>
    <span class="themesListIcons">
        <i class="fa fa-check-square-o"></i> {{theme.avg_score}}
        <i class="fa fa-comment-o"></i> {{theme.count_of_cards}}
    </span>
</a>

我该如何以正确的方式做到这一点?

谢谢你的帮助。

Arman1991

伟大的。对不起,因为我还没有花钱,所以我必须从理论上向你解释。

乔治,您必须在控制器中创建用于选择项目的函数,例如,在您的情况下:

$scope.checkThemeContent = function (name) {
    $scope.selectedName = name;
} 

完成此步骤后,您只能像这样在HTML中调用此函数:

<a href="" 
   ng-class="{selected:theme.name==selectedName}"  
   ng-click="checkThemeContent(theme.name)" 
   ng-repeat="theme in themes" 
   class="list-group-item">
    <b>{{theme.name}}</b>
    <span class="themesListIcons">
        <i class="fa fa-check-square-o"></i> {{theme.avg_score}}
        <i class="fa fa-comment-o"></i> {{theme.count_of_cards}}
    </span>
</a>

请看一下ng-click部分。您必须从列表(“主题”)传递项目(在您的情况下为“主题”)的某些属性(“ theme.name”),因为您无法比较对象。

在ng-class中,您还必须传递与ng-click中相同的属性。希望能帮助到你。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

角度,如何将class设置为单击的列表项并从其他li项中删除?

来自分类Dev

Linq如何将列表项与其他列表项合并

来自分类Dev

如何将PowerShell 7设置为默认设置并删除其他版本

来自分类Dev

Android:单击时如何将onClickListener设置为其他按钮

来自分类Dev

如何将数据从订阅存储/设置到外部变量并从 Angular 7 中的其他类再次读取它

来自分类Dev

单击列表项时如何显示其他数据?

来自分类Dev

当其他li设置为ul时,如何从ul设置为inline-block的ul中的第一个li元素中删除边距

来自分类Dev

如何将选定的recyclerview列表项更改为标记为其他颜色

来自分类Dev

当其他li设置为ul时,如何从ul设置为inline-block的ul的第一个li元素中删除边距

来自分类Dev

MS Access-将下拉列表项存储为表中的其他值

来自分类Dev

单击时为 iOS 滚动视图中的按钮添加边框并从其他按钮中删除边框

来自分类Dev

如何将winform复选框列表项设置为半选中?

来自分类Dev

如何将列表项类设置为活动导航栏

来自分类Dev

删除列表项,无其他参考

来自分类Dev

jQuery-为li选择活动点并从其他活动点中删除活动类

来自分类Dev

如何根据列表项中先前的发射删除重复项

来自分类Dev

如何从以前单击的列表项中删除样式

来自分类Dev

单击导航项时,如何将ProgressBar元素设置为可见?

来自分类Dev

如何将一个静态<li>设置为具有许多<li>的通用<ul>中的最后一项

来自分类Dev

如何将验证错误显示为列表项?

来自分类Dev

如何将class设置为已用orderBy排序的ng-repeat中的第一项?

来自分类Dev

如何在无序列表中使列表项的宽度与其他项相同?

来自分类Dev

在同一模板中设置itemsource时,如何将其他源设置为属性?

来自分类Dev

如何将列表中的元素映射到LISP中其他列表中的值

来自分类Dev

单击后如何将Listview设置为删除线项目?

来自分类Dev

如何将第一项设置为列表视图中的剑道

来自分类Dev

jQuery-单击时添加活动类并从其他元素中删除活动

来自分类Dev

jQuery如何将值从输入字段设置为其他元素的数据属性

来自分类Dev

如何将当前日期时间的格式设置为其他格式?

Related 相关文章

  1. 1

    角度,如何将class设置为单击的列表项并从其他li项中删除?

  2. 2

    Linq如何将列表项与其他列表项合并

  3. 3

    如何将PowerShell 7设置为默认设置并删除其他版本

  4. 4

    Android:单击时如何将onClickListener设置为其他按钮

  5. 5

    如何将数据从订阅存储/设置到外部变量并从 Angular 7 中的其他类再次读取它

  6. 6

    单击列表项时如何显示其他数据?

  7. 7

    当其他li设置为ul时,如何从ul设置为inline-block的ul中的第一个li元素中删除边距

  8. 8

    如何将选定的recyclerview列表项更改为标记为其他颜色

  9. 9

    当其他li设置为ul时,如何从ul设置为inline-block的ul的第一个li元素中删除边距

  10. 10

    MS Access-将下拉列表项存储为表中的其他值

  11. 11

    单击时为 iOS 滚动视图中的按钮添加边框并从其他按钮中删除边框

  12. 12

    如何将winform复选框列表项设置为半选中?

  13. 13

    如何将列表项类设置为活动导航栏

  14. 14

    删除列表项,无其他参考

  15. 15

    jQuery-为li选择活动点并从其他活动点中删除活动类

  16. 16

    如何根据列表项中先前的发射删除重复项

  17. 17

    如何从以前单击的列表项中删除样式

  18. 18

    单击导航项时,如何将ProgressBar元素设置为可见?

  19. 19

    如何将一个静态<li>设置为具有许多<li>的通用<ul>中的最后一项

  20. 20

    如何将验证错误显示为列表项?

  21. 21

    如何将class设置为已用orderBy排序的ng-repeat中的第一项?

  22. 22

    如何在无序列表中使列表项的宽度与其他项相同?

  23. 23

    在同一模板中设置itemsource时,如何将其他源设置为属性?

  24. 24

    如何将列表中的元素映射到LISP中其他列表中的值

  25. 25

    单击后如何将Listview设置为删除线项目?

  26. 26

    如何将第一项设置为列表视图中的剑道

  27. 27

    jQuery-单击时添加活动类并从其他元素中删除活动

  28. 28

    jQuery如何将值从输入字段设置为其他元素的数据属性

  29. 29

    如何将当前日期时间的格式设置为其他格式?

热门标签

归档