ng-repeat filter

publicado por: Anonymous

Buenas tardes, mi problema es el siguiente tengo los siguientes datos.

  <div ng-init='programa=
                  {"cuatrimestres":
                  [
                  {"1":
                      [{"id":"1","codigo":"IF001","Descripcion":"Elementos De Informatica","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Aprobado"},{"id":"2","codigo":"IF002","Descripcion":"Expresion de Problemas y Algoritmos","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Sin Datos"},{"id":"3","codigo":"MA045","Descripcion":"Algebra","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Sin Datos"}],
                  "2":
                      [{"id":"4","codigo":"IF003","Descripcion":"Algoritmica y Programacion 1","carrera_id":"1","cuatrimestre":"2","correlativas":[{"codigo":"IF002","estado":"Sin Datos"}],"estado":"Sin Datos"},{"id":"5","codigo":"MA008","Descripcion":"Elementos de Logica y Matematica Discreta","carrera_id":"1","cuatrimestre":"2","correlativas":"No Tiene","estado":"Sin Datos"},{"id":"6","codigo":"MA046","Descripcion":"Analisis Matematico","carrera_id":"1","cuatrimestre":"2","correlativas":"No Tiene","estado":"Sin Datos"}],
                  "3":
                    [{"id":"7","codigo":"IF004","Descripcion":"Sistemas y Organizaciones","carrera_id":"1","cuatrimestre":"3","correlativas":"No Tiene","estado":"Sin Datos"},{"id":"8","codigo":"IF005","Descripcion":"Arquitectura de Computadoras","carrera_id":"1","cuatrimestre":"3","correlativas":[{"codigo":"IF001","estado":"Aprobado"}],"estado":"Sin Datos"},{"id":"9","codigo":"IF006","Descripcion":"Algoritmica y Programacion 2","carrera_id":"1","cuatrimestre":"3","correlativas":[{"codigo":"IF003","estado":"Sin Datos"},{"codigo":"MA008","estado":"Sin Datos"}],"estado":"Sin Datos"},{"id":"10","codigo":"MA006","Descripcion":"Estadistica","carrera_id":"1","cuatrimestre":"3","correlativas":[{"codigo":"MA045","estado":"Sin Datos"},{"codigo":"MA046","estado":"Sin Datos"}],"estado":"Sin Datos"}],
                  "4":
                    [{"id":"11","codigo":"IF007","Descripcion":"Base de Datos 1","carrera_id":"1","cuatrimestre":"4","correlativas":[{"codigo":"IF006","estado":"Sin Datos"}],"estado":"Sin Datos"},{"id":"12","codigo":"IF030","Descripcion":"Programacion y Diseu00f1o Orientado a Objetos","carrera_id":"1","cuatrimestre":"4","correlativas":[{"codigo":"IF006","estado":"Sin Datos"}],"estado":"Sin Datos"},{"id":"13","codigo":"IF031","Descripcion":"Ingenieria de Software","carrera_id":"1","cuatrimestre":"4","correlativas":[{"codigo":"IF003","estado":"Sin Datos"},{"codigo":"IF004","estado":"Sin Datos"}],"estado":"Sin Datos"}],
                  "5":[],
                  "6":[],
                  "7":[],
                  "8":[],
                  "9":[],
                  "10":[]
                  }
                  ]
                  }
                  '>

Cuando hago el ng-repeat con filter no me filtra los datos como yo espero, al colocar uno

<label>Search: <input ng-model="searchText"></label>

el dato a mostrar seria

{"1":
                      [{"id":"1","codigo":"IF001","Descripcion":"Elementos De Informatica","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Aprobado"},{"id":"2","codigo":"IF002","Descripcion":"Expresion de Problemas y Algoritmos","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Sin Datos"},{"id":"3","codigo":"MA045","Descripcion":"Algebra","carrera_id":"1","cuatrimestre":"1","correlativas":"No Tiene","estado":"Sin Datos"}],



    <table id="searchTextResults">
  <tr><th>Name</th><th>Phone</th></tr>
  <tr ng-repeat="cuatrimestre in programa.cuatrimestres  | filter:{friend:searchText}">
    <td>{{cuatrimestre }}</td>
  </tr>

en donde estaria mi error muchas gracias
</table>

solución

primero que todo debes comprender la estructura de tu array de objetos:

En primer nivel tienes a programa conteniendo un objeto con un solo atributo “cuatrimestres”, hasta allí va todo ok.

En segundo nivel tienes a “cuatrimestres” como un array de un único objeto, esto va a hacer que tu ng-repeat solo itere un objeto.

En tercer nivel está el unico objeto dentro del array de cuatrimestres, este es el punto donde deberías iterar y filtrar con el ng-repeat, pero el siguiente nivel nos dice que el filtro no se hace a este nivel.

En cuarto nivel tienes otro array con multiples objetos lo que indica que tendrías que anidar un segundo ng-repeat con filtro para que busque en todos los resultados en este punto.

   <table ng-repeat="cuatrimestre in programa.cuatrimestres[0]>
    <tr ng-repeat="materia in cuatrimestre | filter: searchText"
    <td>{{ materia }}</td>
    </tr>
  </table>

Como observación ese objeto array de objetos de arrays está muy mal constituido sería buena práctica que te colocaras de acuerdo con quien lo construyó para no causar ese tipo de dolores de cabeza

Te dejo el link para que lo pruebes:
https://jsfiddle.net/ear6j6xc/

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *