достижение угловой функции ng-repeat like в javascript

Im в настоящее время работает над кодом для достижения чего-то вроде ng-repeat в angular. В основном for-loop в html. код берет каждый элемент с классом " loop "и обрабатывает его с информацией, заданной через атрибут" info". Вот код : HTML-код

<div class="loop" data-info="i in 1 to 10">
 -i-
</div>

в JavaScript

$(".loop").each(function(i){
 var loop_info=$(this).attr("data-info");
 var fin=loop_info.match(/(.*) in (\d+) to (\d+)/);
 var variable=fin[1],
 initial=fin[2],
 final=fin[3];
 var htm=$(this).html(),printed="";
 for(j=initial;j<=final;j++){
  var temp=htm;
  var r=new RegExp("-("+variable+")-","g")
  temp=temp.replace(r,j);
  printed+=temp;
 }
 $(this).html(printed);
});

Теперь я также включил функцию для замены-переменной-числами.

все работало отлично, но когда петли вложены я.е

<div class="loop" data-info="i in 1 to 10">
 <div class="loop" data-info="j in 1 to 10">
  -j-
 </div>
</div>

он не работает на вложенном цикле ,i.e-j-не заменяется цифрами. Я не знаю, почему это происходит ,любая помощь приветствуется.

6

1 ответов

замена не удается, потому что HTML изменяется, и следующий .loop ссылка, которую jQuery собрал для вашего for loop, больше не представляет, что это было раньше.

вместо этого сделайте свой for петля идет в обратном направлении:

$($(".loop").get().reverse()).each(function(i){
    // etc...

фрагмент:

$($(".loop").get().reverse()).each(function(i){
  var loop_info=$(this).attr("info");
  var fin=loop_info.match(/(.*) in (\d+) to (\d+)/);
  var variable=fin[1],
      initial=fin[2],
      final=fin[3];
  var htm=$(this).html(),printed="";
  for(j=initial;j<=final;j++){
    var temp=htm;
    var r=new RegExp("-("+variable+")-","g")
    temp=temp.replace(r,j);
    printed+=temp;
  }
  $(this).html(printed);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="loop" info="i in 1 to 10">
    <div class="loop" info="j in 1 to 10">
      -i-:-j-
    </div>
</div>
8