gpt4 book ai didi

javascript - 计算 AngularJS 中 ng-if true 语句的数量?

转载 作者:行者123 更新时间:2023-12-03 06:06:51 30 4
gpt4 key购买 nike

我有一个页面使用 ng-ifs 显示不同的数据,我需要在同一页面上显示其中有多少是正确的。只是号码。 HTML 很复杂,但我制作了一个更简单的版本来理解事情是如何工作的。 HTML 如下所示,并且数据也在页面上进行操作,因此 ng-if 值在渲染后可能会发生变化,因此页面上的计数应该随之变化。

<div ng-if="abc">
some data 1
</div>
<div ng-if="!abc">
some data 2
</div>
<div ng-if="xyz">
some data 3
</div>
<div ng-if="abc">
some data 4
</div>
<div ng-if="!xyz">
some data 5
</div>

我也做了一个plnkr。 http://plnkr.co/edit/5wdiSLhbHpOPJGjRn47L?p=preview

谢谢。

最佳答案

纯 JavaScript 解决方案可能是将类(或属性)添加到具有 ng-if 的 HTML 元素中。条件,然后使用document.getElementsByClassName('class-name').length获取具有 ng-if 的元素数量条件为真。

示例:

<div class="sample-class" ng-if="abc">
some data 1
</div>
<div class="sample-class" ng-if="!abc">
some data 2
</div>
<div class="sample-class" ng-if="xyz">
some data 3
</div>
<div class="sample-class" ng-if="abc">
some data 4
</div>
<div class="sample-class" ng-if="!xyz">
some data 5
</div>

<div>Total count is: {{getCount(); totalCount}}</div>

<script type="text/javascript">
angular.module('app', [])
.controller('ctrl', function($scope, $timeout) {
$scope.totalCount = 0;
$scope.getCount = function(){
$timeout(function(){
$scope.totalCount = document.getElementsByClassName('sample-class').length;
});
};
});
</script>

关于javascript - 计算 AngularJS 中 ng-if true 语句的数量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39503584/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com