按类名计数元素不能按预期工作

我正在尝试使用特定类名称对元素进行计数，该名称将作为切换控件的一部分添加和删除。这意味着报告的计数不正确。按类名计数元素不能按预期工作

我注意到我目前的实现跳过了第一个选定的元素（即不计数），并且只开始第二个元素。

我的代码如下：

查看

<div ng-controller="MyCtrl"> 
    <div class="item item-button-right" ng-repeat="i in [1, 2, 3, 4]"> 

    Full Colour 
    <p>&pound;50 and up to 1 hour</p> 

    <button class="button button-custom" ng:click="bookingSelected = !bookingSelected; 
           $parent.$parent.activeProfileHeader = false; 
           $parent.$parent.displayBookingFooter(true);" ng-class="{ 'button-custom-padding': bookingSelected === true, 
           'button-positive': bookingSelected === false, 
           'booking-selected' : bookingSelected === true, 
           'button-balanced': bookingSelected === true}">{{bookingSelected && '✔' || 'Book'}}</button> 
    </div> 

<br> 

    Total: {{numItems('booking-selected')}} 

</div>

控制器

var myApp = angular.module('myApp', []); 

//myApp.directive('myDirective', function() {}); 
//myApp.factory('myService', function() {}); 

function MyCtrl($scope, $window) { 
    $scope.bookingSelected = false; 

    $scope.numItems = function(className) { 
    return $window.document.getElementsByClassName(className).length; 
    }; 
}

小提琴：http://jsfiddle.net/ha5oac6v/

更新：对不起，代码在jsfiddle不起作用。

来源

2016-05-13 methuselah

您的代码犯规的工作，因为你拼错NG-点击。检查你写的ng：点击。此外，计算类的这个东西似乎不是一个好主意。为什么不把选定的项目推入数组并计算数组长度呢？ – yBrodsky

http://jsfiddle.net/rvukp5Lh/基本上它的工作原理是downvoted。 –

我将如何将所选项目推送到数组中？ – methuselah

刚刚摆脱=== true和=== false。

而是做：

ng-class="{ 
    'button-custom-padding': bookingSelected, 
    'button-positive': !bookingSelected, 
    'booking-selected' : bookingSelected, 
    'button-balanced': bookingSelected 
}"

来源

2016-05-13 17:24:13

按类名计数元素不能按预期工作

回答

相关问题