0

Se quiere cambiar el buscador según su categoría, este es el buscador en angular.js + Laravel:

<select id="selector-sectores" data-placeholder="+ AÑADIR CATEGORÍA" class="form-control"
   chosen="categorias" ng-model="categorias_seleccionadas" multiple=""
   ng-options="categoria.id as categoria.nombre for categoria in categorias.data"></select> 

Ese código módifica el fichero entero en función de la opción que elije el usuario. Se quiere que no sea un select, sino una una lista como esta:

            <div class="menu-opciones">
                <ul>
                    <li><a href='' onclick=''>Cine</a></li>
                    <li><a href='' onclick=''>Restaurantes</a></li>
                    <li><a href='' onclick=''>Eventos</a></li>
                    <li><a href='' onclick=''>Tiendas</a></li>
                    <li><a href='' onclick=''>Noticias</a></li>
                    <li><a href='' onclick=''>Promociones</a></li>
                </ul>
            </div>

He intentado varias cosas pero no encuentro la solución de hacer que la lista funcione, por ejemplo en el momento que se hacia un onclick, que se cambiara el valor de ng-model, hacer el select invisible y así todo funcionaría sin tocar mucho código pero no ha habido manera

¿A alguien se le ocurre una forma de hacerlo?

Un saludo!!

2
  • A ver si entendi. Quieres reemplazar un select por un ul?
    – Einer
    el 29 sep. 2017 a las 12:13
  • Te explico, el objetivo es cambiar gráficamente el select, por una lista ul>li cambiando la menor cantidad de código posible, creo que se podría hacer algo con javascript o php. He intentado que la opción elegida en la lista remplace a través de una función el valor de ng-options pero no hay manera, ademas aunque consiguiera cambiarlo, creo que tendría que hacer la acción de seleccionar el elemento... así que no sé como encararlo el 29 sep. 2017 a las 12:19

1 respuesta 1

0

Intenta utilizar la directiva ngRepeat para imprimir cada elemento del array. Luego le asignas el elemento del ngRepeat a una funcion enviandole el valor por parametro y asi obtendras el valor seleccionado:

angular.module("app",[])
.controller("ctrl", function($scope){
  $scope.model = {};
  $scope.model.items = [{text:"item1", value :1}, {text:"item2", value: 2}];
  
  $scope.model.setModel = function(item)
  {
     console.log(item);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">
 <ul ng-repeat="item in model.items">
  <li ng-click="model.setModel(item)">{{item.text}}</li>
 </ul>
</div>

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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