AngularJS: Pintar inputs en tabla con NG-Repeat
de un catalogo de canales y suproductos (con canales) oganizar una tabla y mostrar un input dependiendo si contienen el mismo canal entre catalago y subproducto
by Porfirio Chavez
January 19, 2016
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.0.0/lodash.min.js"></script>
<div ng-app="checksAPP">
<div ng-controller="CheckController">
<table>
<tr>
<th> Subproducto </th>
<th ng-repeat="canal in datos.canales">{{ canal.nombre }}</th>
</tr>
<tr ng-repeat="subproducto in datos.subproductos">
<td> {{subproducto.nombre}} </td>
<td ng-repeat="canal in datos.canales">
<label>
<div ng-repeat="canalsub in subproducto.canales">
<input type="checkbox" ng-if="canal.nombre == canalsub.nombre">
</label>
</div>
</td>
</tr>
</table>
</div>
</div>
JavaScript
angular.module('checksAPP', [])
.controller('CheckController', function($scope){
$scope.datos = {
canales : [
{id : 1, nombre : 'MB'},
{id : 2, nombre : 'KS'},
{id : 3, nombre : 'RM'},
{id : 5, nombre : 'ZS'},
],
subproductos : [
{
id: 01,
nombre: 'subA',
canales: [
{id : 1, nombre : 'MB'},
{id : 2, nombre : 'KS'}
]
},
{
id: 02,
nombre: 'subB',
canales: [
{id : 2, nombre : 'KS'},
{id : 3, nombre : 'RM'},
]
},
{
id: 03,
nombre: 'subB',
canales: [
{id : 1, nombre : 'MB'},
{id : 2, nombre : 'KS'},
{id : 3, nombre : 'RM'},
{id : 5, nombre : 'ZS'},
]
},
]
}
$scope.valor = "RM";
});