Clear/Reset Matériel AngualrJS <md-saisie semi-automatique>

Je veux réinitialiser <md-autocomplete> de contrôle en Matériel AngularJS.

https://material.angularjs.org/latest/#/demo/material.components.autocomplete
https://material.angularjs.org/latest/#/api/material.components.autocomplete/directive/mdAutocomplete

Fondamentalement, je veux le réinitialiser à l'état initial. Je peux accéder à ng-model & attribuer null. Mais, il n'est pas supprimer le texte affiché à l'écran contenues dans md-item-text attribut.

Qui peut plaire à quelqu'un, laissez-moi savoir comment je peux résoudre le même.

OriginalL'auteur user2538076 | 2015-05-26

  1. 4

    Vous avez besoin de vider le texte de la recherche, ont un oeil à ce codepen:
    http://codepen.io/anon/pen/QbGZWP?editors=101

    J'ai créé un bouton qui appelle la fonction clear:

    function clear() {
  self.selectedItem = null;
  self.searchText = "";
}

    Ce sont les attributs définis sur la md-autocomplete directive:

    <md-autocomplete 
  md-selected-item="ctrl.selectedItem" 
  md-search-text="ctrl.searchText" 
  md-items="item in ctrl.querySearch(ctrl.searchText)" 
>

    Remarque: Vous pourriez avoir besoin des autres attributs de trop, dépend de votre cas.

    votre solution fonctionne, lorsque clear() est invoquée par ng-cliquez sur.. mais il ne fonctionne pas lorsqu'il est appelé à partir de l'intérieur d'une fonction invoquée par md-selected-item-change
    Fonctionne comme prévu. Édité le codepen: codepen.io/anon/pen/vOmqwv?les éditeurs=101
    codepen.io/anon/pen/vdbpYv?les éditeurs=1010 ..md-saisie semi-automatique réinitialisation ne fonctionne pas
    codepen.io/anon/pen/vdbpYv?les éditeurs=1010 ..md-saisie semi-automatique réinitialisation ne fonctionne pas
    Fonctionne étonnamment, je vous remercie. Passé une demi-journée pour résoudre ce problème, jusqu'à ce que j'ai trouvé votre réponse. Gros vote!

    OriginalL'auteur Belicosus

  2. 2

    vous pouvez utiliser md-selected-item-change pour gérer cela.
    par exemple

        <md-autocomplete flex
       md-item-text="item.Text"
       md-items="item in data"
       md-search-text-change="query(searchText)"
       md-search-text="searchText"
       md-selected-item="selectedItem"
       md-no-cache="false"
       md-input-minLength="2"
       md-input-name="exampleAutocomplete"
       md-selected-item-change="addSelectedItem();"
       md-floating-label="Nereye">
           <md-item-template>
               <span md-highlight-text="searchText">{{item.Text}}</span>
           </md-item-template>
           <md-not-found>No matching were found were "{{searchText}}".</md-not-found>
    </md-autocomplete>

    et votre contrôleur de côté, vous devez définir une fonction avec le nom "addSelectedItem" et affecter texterecherché avec une chaîne vide. comme;

    $scope.addSelectedItem = function () {
            $scope.searchText = ''; 
};

    cela fonctionne pour moi. nous espérons qu'il vous aidera à résoudre votre problème.

    codepen.io/anon/pen/vdbpYv?les éditeurs=1010 ..md-saisie semi-automatique réinitialisation ne fonctionne pas
    vous pouvez essayer de md-clair-bouton="true" attribut. Tous les deux travaillent pour moi.

    OriginalL'auteur Vecihi Baltacı

  3. 0

    Ensemble md-min-longueur="1" faire le travail sans extra claire de la fonction de la touche ou.

    codepen.io/anon/pen/vdbpYv?les éditeurs=1010 ..md-saisie semi-automatique réinitialisation ne fonctionne pas
    codepen.io/anon/pen/vdbpYv?les éditeurs=1010 ..md-saisie semi-automatique réinitialisation ne fonctionne pas

    OriginalL'auteur Lin Song Yang