Saltar al contenido

angular ui-bootstrap typeahead callback en selectMatch?

Solución:

Hay una mejor manera de hacer esto ahora. Se ha agregado un nuevo método de devolución de llamada

En el archivo del controlador, agregue lo siguiente:

 $scope.onSelect = function ($item, $model, $label) {
    $scope.$item = $item;
    $scope.$model = $model;
    $scope.$label = $label;
};

A la vista, agregue lo siguiente:

 <input type="text"
        ng-model="selected"
        typeahead="state for state in states | filter:$viewValue"
        typeahead-editable="false"
        typeahead-on-select="onSelect($item, $model, $label)"/>

Consulte las especificaciones de typeahead para obtener más información (busque onSelect).

Compruebe si las siguientes URL ayudan a http://www.techguides.in/how-to-create-autocomplete-using-angularjs-ui/

http://www.techguides.in/how-to-customize-autocomplete-to-display-multiple-columns-using-angularjs-ui-2/

Editar: este método no es el mejor ahora. Es mejor usar la devolución de llamada onSelect como se explica en la respuesta anterior a esta.

Descubrí cómo hacer lo que quería. Vi que hay un atributo que se puede editar con anticipación y, si se establece en falso, el valor seleccionado cambia solo cuando se selecciona un valor del modelo. Y entonces el $ watch está funcionando bien para verificar cuando se selecciona un nuevo valor.

<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue" typeahead-editable="false">

link: function(scope, elm, attrs){
    scope.$watch('selected', function(newValue, oldValue) {
        if (newValue)
          console.log(oldValue+"->"+newValue);
     });
}

Lo siguiente debe ser su HTML

 <input id="title" type="text"  ng-model="title"  typeahead="data.enquiry_title for data in titleData | filter:$viewValue | limitTo:8" 
typeahead-on-select="onSelect($item, $model, $label)" />

solo agrega typeahead-on-select en la etiqueta de entrada con la función de devolución de llamada.

Lo siguiente iría dentro del controlador

$scope.onSelect = function ($item, $model, $label) {
            console.log($item);
            if($item.tid)
                $scope.activeTitleId = $item.tid
        };

dentro de $ item obtendrá el objeto completo que ha pasado en la matriz principal de la lista de sugerencias

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *