如何使用ng repeat在匹配的元素上添加活动类
How to add active class on matching elements using ng-repeat
我正在进行多重下拉选择,但它也允许单独选择列表项。它不是一个选择元素,而是一个在角度分量中保存数据的tr。
我在ctrl.checkEquality中的控制器内部使用angular.equals来查看当前行和通过ng模型传递的值是否相同,如果它们相同,则所选行将获得活动的绿色类。我基本上想知道我是否可以用我现有的代码做一些类似的事情,但设置ng模型,使其在按下"ctrl"键时将活动类应用于多个选定值的数组。
<tr ng-repeat="row in ctrl.filteredItems" ng-class="{'active': ctrl.checkEquality(row, ctrl.ngModel) ng-mousedown="ctrl.onSelectedLocal(row, $event)">
</tr>
public onSelectedLocal(row: ng.IAugmentedJQuery, $event: ng.IAngularEvent) {
if ($event["ctrlKey"]) {
this.setFocusedRow(-1);
this.filterText = "";
// if (this.selectedItems.indexOf(row) === -1) {
// this.selectedItems.push(row);
// for (var i = 0; i < this.filteredItems.length; i++) {
// if (this.filteredItems[i] === row) {
// }
// }
// }
if (this.ngChange) {
this.ngChange({ itemSelected: row });
}
console.log(this.selectedItems);
//we need to make sure the click event of selecting an item in the dropdown stops here
//otherwise it will run into the resetInput function below and not show the selected city in the input element when filterText is used
$event.preventDefault();
$event.stopPropagation();
} else {
this.setFocusedRow(-1);
this.filterText = "";
this.ngModel = row;
this.ngModelValue = (this.showSelectedItem === false) ? "" : row[this.itemDisplayProperty];
if (this.ngChange) {
this.ngChange({ itemSelected: row });
}
this.filteredItems = this.items; //reset filteredItems back to initial items
this.closeDropdown();
//we need to make sure the click event of selecting an item in the dropdown stops here
//otherwise it will run into the resetInput function below and not show the selected city in the input element when filterText is used
$event.preventDefault();
$event.stopPropagation();
}
我需要在任何匹配行上设置一个"活动"类(或其他什么),就像我目前在ng类"活动"类别中所做的那样,但如果用户按住ctrl键,只要按住ctrl,我就需要能够将该活动类添加到所有tr中。
我的ng模型目前不是一个数组,它目前只持有一个基于用户选择一个元素的值。
我该怎么做?非常感谢您的帮助。
我认为您在tr
标记中的ng-class
末尾错过了一个结束标记。
<tr ng-repeat="row in ctrl.filteredItems" ng-class="{'active': ctrl.checkEquality(row, ctrl.ngModel)" ng-mousedown="ctrl.onSelectedLocal(row, $event)">
相关文章:
- 如何将html元素添加到tampermonkey中
- 如何将html元素添加为生成的内容
- 如何向Selectize元素添加渲染和创建方法
- 向html选择元素添加选项
- 在d3中向DOM元素添加了图像,但现在它赢得了't过渡
- 如何将新的键/值对元素添加到现有数组
- 使用docment.createElement向元素添加选项
- ng重复向一个元素添加条件类
- 为li元素添加标题
- 向ckeditor中的多个元素添加内联样式
- Javascript 向影子根中的自定义元素添加函数
- 将伪元素添加到<文本区域>
- 如果类只包含一个特定数字,则向元素添加类
- DOM:将空元素添加到 DOM 和页面重排
- 是否有 jQuery 事件用于何时将元素添加到文档中
- 通过 ajax 使用自定义滚动条向元素添加内容
- 是否可以用D3将svg元素添加到开放层映射中
- 如何将元素添加到动态数组并排除现有元素
- 在AngularJS中将元素添加到作用域时,如何在所有设备上播放声音
- 将图像元素添加到<a>标签