2015-03-23 10 views
6

ho questo due pulsanti nella mia HTML:history.pushState non funziona in Controller

<a href="" class="sbtn sbtn-default" ng-click="GoToNext()"><i class="fa fa-angle-right"></i> Next </a> 
<a href="" class="sbtn sbtn-default" ng-click="GoToPrev()"> Prev <i class="fa fa-angle-left"></i></a> 

poi nel mio controller:

$scope.GoToNext = function() { 
    var nextPage = getNextPage("next"); 

    history.pushState(null, "Site Title", nextPage); 
    getQuestion(); 
} 

$scope.GoToPrev = function() { 
    var prevPage = getNextPage("prev"); 

    history.pushState(null, "Site Title", prevPage); 
    getQuestion(); 
} 

e la funzione getNextPage è:

function getNextPage(type) { 

    var querystr = window.location.pathname.split('/')[4]; 
    var currentQuestion = querystr.split("-")[1]; 
    var currentBook = querystr.split("-")[0]; 

    switch (type) { 
     case "next": 
      return ((currentBook + "-") + (+currentQuestion + +1)); 

     case "prev": 
      if (currentQuestion == 1) 
       return (currentBook + "-1"); 

      return ((currentBook + "-") + (+currentQuestion - +1)); 

    } 

}; 

il mio Url è simile al seguente:

http://localhost:14799/app/Dashboard/Question/1-330

funzione getQuestion solo ottenere i dati dal server di, ho già provato fuori e restituire i dati senza alcun problema, in realtà restituire i dati a caricamento della pagina senza alcun problema.

quello che sto cercando di fare è cambiare l'URL e ottenere la domanda successiva o precedente facendo clic su quei pulsanti. ma ciò che sta accadendo è che chiama la funzione getQuestion ma l'URL non sta cambiando. se guardo molto attentamente l'URL e presta attenzione, ottengo il resto e torno alla pagina precedente molto molto velocemente, solo un flash!

Non ho niente nel mio codice per tornare alla pagina precedente.

quello che provo è aggiungere console.log nella funzione getNextPage per vedere se chiama due volte, ma non lo fa, basta chiamare una volta per ogni clic.

se provo a pushState in console, funziona!

Aggiungo anche il log della console alla fine della mia funzione getQuestion per vedere se rimane bloccato nel mezzo della funzione, ma no! il log della console sta accadendo ma torna alla pagina precedente.

Ho appena provato disperatamente le cose, ma senza fortuna.

+0

Questo è fastidioso per me perché non sto usando ngRoute e sto usando Angular solo per alcune cose e voglio fare un po 'di 'pushState' manuale senza alcun risultato. Ho notato che il wrapping in un 'setTimeout' funziona, ma' document.location.search' restituisce ancora il vecchio valore. –

risposta

1

anni fa ero alle prese con questo problema e ora capisco. non è come funziona angolare. dovrei usare il modulo ngRoute per fornire le navigazioni. non si tratta di uno stato non funzionante o di qualcos'altro, si tratta di come funziona l'angolare.

non ho bisogno di $scope.GoToNext o $scope.GoToPrev per la navigazione perché angolare lo farebbe automaticamente per me. basta cambiare il percorso ed è fatto. tutto funziona bene

-2

pushState è supportato in modo incoerente su varie piattaforme browser. Prova invece a History.js.

+0

come ho detto, funziona se provo in console, quindi funziona e non c'è alcun problema con il browser. –

+0

sei riuscito a farlo funzionare? –

+0

no bro, cambio il mio codice e cerco di farlo funzionare con ui-router (a causa di più viste) –

Problemi correlati