кол-во дочерних элементов в AngularJS

Я прошел через множество ответов, чтобы узнать, как подсчитать количество дочерних элементов в Angular JS, но я не понял. Пожалуйста, посмотрите мой простой код и предложите мне супер простой метод подсчета числа детей.кол-во дочерних элементов в AngularJS

Хочу рассчитать общий ребенок до <div id="myDiv"> и всего span элементов под <div id="myDiv">.

Здесь общая no of child = 5 и общая span elements = 3

<html> 
    <body ng-app="myApp" ng-controller="myCtrl"> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 

     <button ng-click="countElem()">Count</button> 
     <div id="myDiv"> 
      <span>child 1</span> 
      <span>child 2</span> 
      <span>child 3</span> 
      <p>child 4</p> 
      <p>child 5</p> 
     </div> 

     <script> 
      var app = angular.module("myApp", []); 
       app.controller("myCtrl", function($scope){ 

      }); 
     </script> 
    </body> 
</html>

источник

2016-12-14 Rahul Sarkar

Вы можете использовать querySelectorAll и получить длину на нем

проверки следующий фрагмент

var app = angular.module("myApp", []); 
 
app.controller("myCtrl", function($scope) { 
 
    $scope.countElem = function() { 
 
    var div = document.querySelector('#myDiv'); 
 
    var spanCount = div.querySelectorAll('span').length; 
 
    var pCount = div.querySelectorAll('p').length; 
 
    console.log("spanCount" + spanCount); 
 

 
    console.log("pCount" + pCount); 
 
    } 
 
});

<html> 
 

 
<body ng-app="myApp" ng-controller="myCtrl"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
    <button ng-click="countElem()">Count</button> 
 
    <div id="myDiv"> 
 
    <span>child 1</span> 
 
    <span>child 2</span> 
 
    <span>child 3</span> 
 
    <p>child 4</p> 
 
    <p>child 5</p> 
 
    </div> 
 

 
    <script> 
 
    </script> 
 
</body> 
 

 
</html>

Надеется, что это помогает

источник

2016-12-14 05:46:51 Geeky

Вау, отлично работает. Большое спасибо. –

Your HTML like this... 

<div class="row"> 
    <div class="cols">col 1</div> 
    <div class="cols">col 2</div> 
    <div class="cols">col 3</div> 
</div> 
<div class="row"> 
    <div class="cols">col 1</div> 
    <div class="cols">col 2</div> 
</div>

Вы можете использовать приведенный ниже сценарий:

angular.forEach(document.querySelectorAll('.row'), function(val, key){ 
angular.element(val).removeClass('row'); 
angular.element(val).addClass('row'+angular.element(val).children().length); 
});

источник

2017-06-21 15:00:35

кол-во дочерних элементов в AngularJS

ответ

Смежные вопросы