问题标签 [angularjs-ng-class]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
1496 浏览

angularjs - 有选择地向 ng-repeat AngularJS 添加一个类

我有一个表的 ng-repeat,我希望能够在单击时添加一个类<td>,并在未单击时删除该类。<td>可以同时选择多个。现在所有的城市都在申请或没有申请。

例如:(假设节点有 100 个项目)

在我的 JS

0 投票
2 回答
2898 浏览

javascript - 如果搜索字段有值,则添加类:Angularjs

我有一个搜索输入字段和一个列表框,

我需要添加类说

每当有文字时,我应该发生在更改功能上。单击 .addClear 类搜索字段应该为空,ng-model 也是如此。

我怎样才能做到这一点?

我尝试ng-class="{'addClear': searchRoleOne}"在搜索字段中使用。它不能正常工作。

0 投票
2 回答
9701 浏览

javascript - Angularjs 标记表行或列取决于值

有没有办法在行或列上添加类取决于值。如果列“anzahl”为空,则行背景颜色必须为“灰色”,列“anzahl”背景颜色变为“红色。

jsfiddle

0 投票
1 回答
842 浏览

angularjs - 角度嵌套的 ng-repeat 类变量

所以我有一个相当复杂的角度表,我有重复部分都很好,但是当我用ng-class-evenand设置一个变量时ng-class-odd,这个变量似乎没有持续存在。也许我误解了 的范围ng-repeat,但我很难过。

我的重复看起来像:

所以,我希望在行循环时设置颜色。这是一个带有示例设置的小提琴。

0 投票
1 回答
1889 浏览

javascript - 如何在使用 ng-click:predicate 时使用 ng-toggle 和 ng-class 更改图标

predicate用来轻松地对数据模型中的项目进行排序。现在我正在添加一个向上和向下箭头图标来显示排序当前所处的状态。

谓词 orderBy 实例:http ://plnkr.co/edit/?p=preview

在此处输入图像描述

不确定如何在谓词中切换这些值:

控制器

我在这里没有使用函数,这就是为什么我现在很难看到如何切换它。


有没有办法挂钩并更改recentAddedvar?
这将反过来改变ng-class

然后基于谓词,切换ng-class

0 投票
2 回答
191 浏览

javascript - 如何结合 ng-class 检查和 ng-click 比较?

我有一个 ng-repeat,其中第一个项目需要选择类,然后单击每个项目然后更改选择。

^ 这可以让第一个项目selected默认具有类。

^ 感谢这个问题。上面的作品添加了selected基于点击的类,但默认情况下不再选择第一项。

我的问题是如何将两者结合起来?我尝试了以下方法,但没有成功:

我的控制器:

0 投票
4 回答
100 浏览

javascript - 如何使用控制器变量和 ng-click 来切换类?

http://plnkr.co/edit/nEfBE33AJen3mz9YvjeC?p=preview

我有一个标签按钮列表,默认情况下,加载所有项目后,我将前 3 个项目设置为具有selected该类。

现在我还需要标签来获得或失去selected.ng-click

您将如何组合标记或控制器中的代码?

HTML

基本上我想结合类似{'selected' : toggle.state}的东西: 成行ng-class。现在我的代码取消选择所有内容。

在此处输入图像描述

有任何想法吗?

0 投票
3 回答
10849 浏览

angularjs - How to use $index to change class in ng-repeat?

I have a list which is limited to 3 items, the first item needs class blue1, 2nd needs blue2, 3rd blue3.

Is there a way to write a check like
ng-class="{blue1: tag == 1 || blue2: tag == 2 || blue3: tag == 3 }"

0 投票
1 回答
89 浏览

javascript - 如何修复这个 ng-class 切换比较?

http://plnkr.co/edit/7v63GXSIDon1QKm1GXCE?p=preview

我有一个array存储被单击的每个按钮的名称。一旦单击对象被放入数组中,我ng-class会检查数组中对象的名称是否与用于创建按钮的模型相同。然后,如果是这样,请btn-info打开或关闭课程。

不知道我的代码有什么问题,但是如果您以从 1 到 3 的确切顺序单击按钮,它会起作用。但是,一旦您开始随机单击按钮,它就会很快中断。

plnkr 示例

控制器

标记

0 投票
1 回答
1711 浏览

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

我有一个未排序的项目列表,我orderBy用来按名称按字母数字排序。

现在在我的控制器中,这就是我当前设置所选类的第一个项目的方式:

^ 这工作得很好,直到我需要添加,orderBy以便项目按 alpha 顺序显示:

在此处输入图像描述

我在这里找到了这个答案,但是它将第一项锁定为始终拥有该课程。

稍微修改一下我的代码,我可以让其他按钮在单击时获得该类,但是该$first项目仍然保留在该类中。

在我的控制器中,这是我的unselectAll函数,它不适用于'selected':$first

在此处输入图像描述

标记或控制器中的代码应如何更新以解决此问题?