2

Tengo dos Botones de alta y Baja, quiero que al inicio cuando todos sean true solo se vea el boton de Baja y si alguno esta en FALSE se vea el boton de Alta

<table class="table table-sm" ng-init="GetData()">
    <thead>
        <tr>
            <th>Dirección</th>
            <th>Estado</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="l in List">
            <td>{{l.Direccion}}</td>
            <td><i ng-class="l.Estado ? 'btn btn-info btn-sm' : 'btn btn-danger btn-sm'"><b>{{l.Estado ? 'Activo' : 'Inactivo'}}</b></i></td>
            <td>
                <button type="button" class="btn btn-success btn-sm" ng-click="VerIglesia(l.Id)">
                    <span class="fa fa-eye" aria-hidden="true"></span>
                </button>

                <button type="button" class="btn btn-warning btn-sm" ng-click="Editar(l.Id)">
                    <span class="fa fa-pencil" aria-hidden="true"></span>
                </button>

                <button type="button" ng-hide="btnAlta" class="btn btn-info btn-sm" ng-click="Alta(l.Id)">
                    <span class="fa fa-angle-up" aria-hidden="true"></span>Alta
                </button>

                <button type="button" ng-hide="btnBaja" class="btn btn-danger btn-sm" ng-click="Baja(l.Id)">
                    <span class="fa fa-angle-down" aria-hidden="true"></span>Baja
                </button>
            </td>
        </tr>
    </tbody>
</table>

introducir la descripción de la imagen aquí

Aqui puedo ver a unos que estan activos y otros Inactivos

introducir la descripción de la imagen aquí Algo como esto introducir la descripción de la imagen aquí

5
  • ¿A qué te refieres con “cuando todos sean true”? ¿Podrías escribir tu código javascript? "Este mensaje te lo dejó el usuario byrdEmanuel"
    – user75901
    Commented el 26 oct. 2018 a las 3:40
  • @byrdEmanuel me refierocuando vienen mis direcciones en la lista para mostrar hay algunos que vienen con true y otros con false entonce para cada uno mostrar el boton que correspondo y no mostrar los dos botones TRUE = btnBaja y FALSE = btnAlata Commented el 26 oct. 2018 a las 3:58
  • podrias explicar con algun debug o un jsfiddle para poder ayudar? Commented el 26 oct. 2018 a las 3:58
  • @jsonencode ahora si? Commented el 26 oct. 2018 a las 4:03
  • @shadow ahora si? Commented el 26 oct. 2018 a las 4:04

4 respuestas 4

2

Si entiendo bien tus botones dependen de la propiedad .Estado de cada elemento de tu lista. Siendo asi tu HTML deberia quedar algo como:

<button type="button" ng-hide="l.Estado" class="btn btn-info btn-sm" ng-click="Alta(l.Id)">
    <span class="fa fa-angle-up" aria-hidden="true"></span>Alta
</button>

<button type="button" ng-show="l.Estado" class="btn btn-danger btn-sm" ng-click="Baja(l.Id)">
    <span class="fa fa-angle-down" aria-hidden="true"></span>Baja
</button>
0
2

Para mi deberias realizar un ng-if en tu consulta

Entonces cuando tengas :

            <button type="button" ng-hide="btnBaja" class="btn btn-danger btn-sm" ng-if="aplicar-condicional">
                <span class="fa fa-angle-down" aria-hidden="true"></span>Baja
            </button>

Puedes diferenciar la condicion utiizando la funcion ng-if.

Saludos capo.

2

Por qué no agregar una clase al atributo [disabled]?

En HTML:

<button ng-disabled="!l.Estado">
  <span></span>Alta
</button>
<button ng-disabled="l.Estado">
  <span></span>Baja
</button>

En CSS:

button[disabled] {
    visibility: hidden;
}
2

Usa en los dos botones que quieres:

<button ng-hide="l.Estado">
  <span></span>Alta
</button>
<button ng-show="l.Estado">
  <span></span>Baja
</button>

Esto debería funcionar.

(Omití algo del código para mostrar solo lo relevante en la pregunta)

1
  • 1
    Cuidado que eso no son comillas dobles.
    – user13558
    Commented el 28 feb. 2019 a las 22:51

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.