Trasy Sammy.js nie wystrzeliwują z łączy Knockout w IE10

Question

Mam jedną aplikację strony, która używa Knockout.js do wiązania danych i Sammy.js do routingu adresów URL po stronie klienta (hash).

W Internet Explorerze widzę jednak dziwny problem: czasami linki po kliknięciu zmieniają adres URL w pasku adresu przeglądarki, ale odpowiednia trasa Sammy nie zostanie uruchomiona.

To się nie dzieje za każdym razem (ale mogę konsekwentnie odtworzyć błąd), a dzieje się to tylko w IE10 (Chrome działa dobrze za każdym razem). Wydaje się być również związany z Knockoutem, ponieważ zestaw zakodowanych na sztywno linków nie wykazuje tego samego problemu.

celu zilustrowania, ja zabrana wszystko poza minimum odtworzyć problem, tworząc dwa przykłady jsbin:

przykładem 1 (odcięcia):http://jsbin.com/aretis/2/

widzi ten problem, otwórz powyższy link i kliknij "Record # 1", następnie "Baz", a następnie "Record # 1" ponownie. Adres URL rekordu 1 pojawi się na pasku adresu, ale trasa dla tego rekordu nie zostanie dołączona do listy.

Przykład 2 (bez odcięcia):http://jsbin.com/amivoq/1/

W tym przykładzie, ma statyczną listę odnośników płytowych zamiast listy danych związanej. Kliknięcie dowolnego linku (w dowolnej kolejności) spowoduje, że trasa zostanie dodana do listy (tak jak powinna).

Przypomnienie, że należy je uruchomić w IE, aby odtworzyć problem.

Wszelkie pomysły?

Answer 1

Zgodnie z powyższym komentarzem obejrzałem ten problem, łapiąc zdarzenie window.hashchange i samodzielnie analizując adres URL. Jest to jedyna część Sammy.js, której naprawdę używałem i nie miałem szczęścia, aby znaleźć prawdziwy problem. Mam nadzieję, że to pomoże komuś innemu.

Pierwszą rzeczą, jaką zrobiłem było powiązać zdarzenie hashchange:

$(function() { 
    $(window).on("hashchange", HandleUrl); 

    // Call our URL handler to deal with any initial URL given to us. 
    HandleUrl(); 
} 

Wymaga URL następujące parser:

function HandleUrl() { 
    var hash = location.hash; 

    if (hash.indexOf("#Account") >= 0) { 
     var splitParts = hash.split("/"); 

     if (splitParts.length >= 2) { 
      ShowLoadingBox(); 
      ShowAccountDetailFromId(splitParts[1]); 
     } 
    } else if (hash.indexOf("#Contact") >= 0) { 
     var splitParts = hash.split("/"); 

     if (splitParts.length >= 2) { 
      ShowLoadingBox(); 
      ShowContactDetailFromId(splitParts[1]); 
     } 
    } else if (hash.indexOf("#ThingsToDo") >= 0) { 
     SwitchToPanel("navPanelThingsToDo"); 
    } else if (hash.indexOf("#ThingsIveDone") >= 0) { 
     SwitchToPanel("navPanelThingsIveDone"); 
    } else if (hash.indexOf("#Reports") >= 0) { 
     SwitchToPanel("navPanelReports"); 
    } else { 
     SwitchToPanel("navPanelMyAccounts"); 
    } 
} 

Funkcje takie jak ShowAccountDetailFromId() i SwitchToPanel() prostu pokazać i wypełnić (za pomocą połączenia Ajax do usług sieciowych) odpowiednie <div>. Jest to prawdopodobnie całkowicie naiwne podejście, ale działa (tzn. Możesz dodać zakładki do adresów URL, przycisk Wstecz i historię przeglądarek itp.). Przepraszam za "brak odpowiedzi".