Access Controller portata da Bootstrap-UI modello typeahead

non sono in grado di chiamare una funzione di controllo dall'interno di un custom-modello con ui-typeahead:Access Controller portata da Bootstrap-UI modello typeahead

<input typeahead="val for val in autoComplete($viewValue)" 
    typeahead-template-url="searchAutocompleteTpl.html" 
    ng-model="query"/> 

<script type="text/ng-template" id="searchAutocompleteTpl.html"> 
    <span ng-repeat="eqp in match.model.equipment"/> 
    <a href="" ng-click="showItem(eqp.model)"> 
     found in: {{eqp.model}} 
    </a> 
</script>

Il problema è che la portata del controller sembra essere assente in il modello:

showItem(eqp.model)

non viene mai chiamato. Ho anche provato con:

$parent.showItem(eqp.model)

inutilmente.

Come è possibile chiamare una funzione/un valore sull'ambito del controller, quindi?

fonte

2013-08-26 recalcitrant

Mi sono imbattuto nello stesso problema e ho dato un'occhiata allo typeahead code on github per vedere se questo potrebbe offrire qualche indizio. Sembra che ci siano diverse direttive coinvolte nella creazione dell'elenco di suggerimenti e ognuno di essi abbia il proprio ambito figlio.

In altre parole, il tuo $parent.showItem(eqp.model) è stato un buon tentativo, ma non hai raggiunto livelli sufficienti. Che cosa ha funzionato per me è stato: $parent.$parent.$parent.showItem(eqp.model)

fonte

2013-10-09 11:01:39

grazie, ma sai perché? e dove possiamo vedere chiaramente la struttura dello scopo. – Awakening

Ci sono voluti 4 $ per me per ottenere l'ambito originale. – ddalex

Dipende come e dove lo si utilizza. typeahead introduce chiaramente uno scope isolato da qualche parte, il che significa che non puoi ereditare prototipicamente dai tuoi scopi genitore. Questo è il motivo per cui devi usare $ parent, che è popolato da angolare anche in ambiti isolati. Se stai usando typeahead nella tua stessa direttiva che definisce anche un ambito isolato, devi passare alla catena $ parent 4 volte per raggiungere l'ambito di base. Ovviamente a questo punto potresti voler riconsiderare il tuo codice. Il punto di un ambito isolato è che può essere riutilizzato perché non dipende da un genitore. –

La soluzione del problema è quello di avviare un oggetto nel modello nell'ambito del controllore in questo modo:

$scope.typeaheadObject = { 
    query : '', 
}

ora nel tuo modulo è necessario modificare la vostra ng-modello con :

ng-model="typeaheadObject.query'

Questo creerà l'typeaheadObject oggetto in tutto il vostro controller, se non si ri-avvia in uno dei controller. Quindi, quando si vuole accedere al contenuto dell'oggetto in uno di questo controller si solo fare ad esempio:

console.log($scope.typeaheadObject.query)

questo è un problema classica in angularJs. È possibile accedere e modificare un ambito genitore solo se la variabile è disponibile in un oggetto

Infine, è necessario utilizzare un '.' nel tuo modello-ng. Ciò consentirà al modulo ui-bootstrap e al proprio modulo di condividere il proprio ambito con l'oggetto.

Ho appena fatto un esempio su plunker per essere sicuro di aver capito bene il problema.

http://plnkr.co/edit/4YWNMagm571Gk2DrCERX?p=preview

Buona giornata :)

fonte

2015-07-30 15:25:33 stephanec

ho anche lo stesso problema. Non sono sicuro, ma sta funzionando.

È possibile utilizzare il doppio $parent anziché singolo.

ad es. $parent.$parent.showItem(eqp.model)

fonte

2016-07-14 06:22:37

Ha funzionato per me dopo l'aggiunta di 4 genitori. $ genitore. $ Genitore. $ Genitore. $ Genitore.

fonte