2016-03-17 10 views
5

ho una serie ricorsiva in js:AngularJS - Come accedere una matrice all'interno di una nidificato ng-repeat

[{ 
    type: 'cond', 
    conditionId: 1, 
    conditions: undefined 
}, 
{ 
    type: 'cond', 
    conditionId: 2, 
    conditions: undefined 
}, 
{ 
    type: 'group', 
    conditionId: undefined, 
    conditions: [{ 
     type: 'cond', 
     conditionId: 3, 
     conditions: undefined 
    }, 
    { 
     type: 'cond', 
     conditionId: 4, 
     conditions: undefined 
    }] 
}] 

visualizzare nel AngularJS utilizzando ng-repeat ricorsivamente con il modello in linea:

<script type="text/ng-template" id="recursive_template.html"> 
<div> some logic </div> 
     <div ng-repeat="cond in cond.conditions" ng-include="'recursive_template.html'"></div> 
    <div> some more logic </div> 
</script> 

<div ng-controller="EditRulesController"> 
    <div ng-repeat="cond in conditions" ng-include="'recursive_template.html'" class="row"> 
    </div> 
</div> 

Tutto funziona bene. Ora voglio eliminare un elemento dall'interno ng-repeat. Posso ottenere l'indice dell'elemento su cui clicco (per eliminare) con $ indice, anche l'oggetto cond come parametro su ng-click. Posso anche accedere $ genitore ma punta alla radice dell'oggetto ...

Come accedere alla matrice interiore senza manualmente la ricerca in tutto il condizioni serie in modo ricorsivo? È strano che tu possa facilmente accedere all'indice dell'array interno ma non all'istanza dell'array reale.

E qualche consiglio su questo problema? Grazie ..

EDIT 21/03/2016

Prima la risposta accettata, la versione 'forza bruta' è implementata in questo modo:

 $scope.deleteConditionClick = function (id) { 
      deleteCondition($scope.conditions, id); 
     }; 

     function deleteCondition(conditions, id) { 

      var conds = conditions; 
      if (conds) { 
       for (var i = 0; i < conds.length; i++) { 
        if (conds[i].type === 'cond') { 
         if (conds[i].conditionId === id) { 
          conds.splice(i, 1); 
          return true; 
         } 
        } else if (conds[i].type === 'group') { 

         deleteCondition(conds[i].conditions, id); 
        } 
       } 
      } 
     } 

spero che aiutare gli altri con problemi simili.

+0

Non riesci ad accedervi come cond.conditions.type, cond.conditions.conditionId? –

+0

'$ parent. $ Parent' -' ngInclude' sta creando * un altro * ambito tra la ripetizione del genitore e la ripetizione del bambino. – tymeJV

+0

'$ parent. $ Parent' mi ha dato l'ambito del controller, quindi di nuovo la radice dell'array. –

risposta

2

hai provato impostazione si elimina l'azione di essere ng-click="cond=undefined" Ciò svuotare il de?.? condizione lasciata. Potresti quindi utilizzare ng-show/ng-if per controllare la visibilità nella vista.

0

È possibile passare la matrice genitore e l'oggetto come parametri (ad es .: ng-click="delete(conditions, cond) ") e di utilizzare .indexOf() funzione per trovare l'indice dell'oggetto (ad es. $scope.delete = function(conditions, cond){index = conditions.indexOf(cond)...})

+1

Sì, ho provato questo, ma mi dà la radice dell'array perché c'è un '$ scope.conditions' nel controller. Ho anche provato a rinominare quella variabile per avere un nome diverso dagli array interni. Sfortunatamente non funziona. –

1

questo è come mi afferra oggetti con multipla indici:

<div ng-repeat="x in outerArray" ng-init="outerIndex = $index"> 
    <div ng-repeat="y in innerArray"> 
    {{ innerArray[outerIndex] }} 
    </div> 
</div> 

credo che questo sia quello che stavi chiedendo Spero che aiuta

+0

Grazie, mi piace. Il problema è che il mio oggetto può essere annidato a qualsiasi livello, non solo 2. In questo caso è necessario un elenco di indici esterni, che è ancora difficile da gestire. –

+0

La soluzione di @michaelbinks ha risolto il problema o dovrei proporre qualcos'altro? –

+0

Sì, è un'ottima soluzione, ma sono curioso di sapere se avete altre idee :) –