AngularJS ng-include tun HistoryJS aufhören zu arbeiten

Mein Code funktionierte, bis ich begann, ng-include zu verwenden. Jedes Mal, wenn ich auf eine Seite gehe, die diese Anweisung verwendet, bleibe ich auf der Seite stecken. Der Zurück-Button funktioniert nicht mehr und du bleibst für immer in einer Schleife der gleichen Seite.AngularJS ng-include tun HistoryJS aufhören zu arbeiten

Meine Website läuft mit Asp.NET MVC 5.

Einige Bits meines Codes:

HTML "host"

<div id="place"> 
    <div data-ng-include="'/app/angular/views/place.html'"></div> 
</div>

HTML place.html

<div> 
    <h1>{{place.PlaceName}}</h1> 
    <ul class="unstyled-list"> 
     <li data-ng-repeat="hint in place.Hints"> 
      <!-- more code --> 
     </li> 
    </ul> 
</div>

JAVASCRIPT

$scope.place = { }; 

// 'maps' is a google maps plugin 
maps.autoComplete({ success: function(result) { 
    // gets the result of the user search 
    History.pushState({ name: result.name, id: result.id }, result.name, '/place/' + result.id); 
}); 

History.Adapter.bind(window, 'statechange', function() { 
    var state = History.getState(); 

    // go to the server and get more info about the location 
    $mapService.getMetaInfo({id: state.data.id}).then(function (d) { 
     // get place info 
     $scope.place = d; 
    }); 
});

Wenn ich die ng-include entfernen und ersetzen Sie es mit dem "rohen" html, es funktioniert gut. Diese "Endlosschleife" tritt nur auf, wenn ng-include hinzugefügt wird.

Quelle

2014-01-16 Le Coder

Ich denke, Sie sollten zeigen, wie Sie die 'ng-include'-Direktive verwenden, und falls Sie es richtig verwenden, sollten Sie einen Plucker bereitstellen, der das Problem reproduziert. – Stewie

Sie sollten jedes externe Plugin in eine Angular-Direktive umwandeln, wobei das Mischen von zwei verschiedenen Paradigmen für die DOM-Manipulation nicht sinnvoll ist. –

Ich kann mir nicht vorstellen, dass irgendjemand das macht.Wenn es ein einfaches Plugin wäre, würde ich dir zustimmen, aber ** irgendein ** Plugin ... es ist irgendwie zu schwer, findest du nicht? –

Ich hatte dieses Problem einmal, und es scheint der HTML5-Modus zu sein.

versuchen, dies in Ihre App Config hinzuzufügen:

$locationProvider.html5Mode(false);

Quelle

2014-03-21 11:27:21

setzen Sie den Code in setTimeout, denn wenn man ng-umfassen ein paar mili secound html und hängen zu div laden müssen verwenden, umfassen ng-haben.

setTimeout(function{ 
// write your code here 
},100)

Quelle

2014-04-23 12:21:31 sajjad

A denke, ein Rückruf wäre eine zuverlässigere Lösung als ein Timeout. Was passiert, wenn die Netzwerklatenz die Anforderung für 101 Millisekunden oder 200 Sekunden hält? Vielleicht könntest du das Versprechen für diese Anfrage bekommen und einen erfolgreichen Callback einreichen. – Trevor

Wenn Sie Vorlagen-URL innerhalb ng-include Richtlinie festgelegt, die angegebenen Vorlage durch Winkel gecallt dann legte sie es in Winkel $templateCache und dann wird, dass der Inhalt auf der Ansicht machen. Wenn Sie es das nächste Mal aufrufen, wird es direkt aus dem eckigen $ templateCache abgerufen. Ich würde es vorziehen, dass Sie diese Vorlage in templateCache in eckigen run Phase (vor eckigen Lauf es kompilieren Zyklus.) Ich würde vorschlagen, dass Sie diese Vorlage bei der Inbetriebnahme von eckigen laden.

diese Vorlage Setzen Sie in Ihrem Winkel $templateCache vor (dh direkt nach dem Winkelkonfigurationsphase)

CODE

angular.module('app',[]). 
config(function(){ 
    //configuration code will be here. 
}). 
run(function($templateCache,$http){ 
    //run block will run write after the config phase 
    $http.get('/app/angular/views/place.html',{ cache : $templateCache } 
});

Nach dieser Vorlage auf der Seite Winkel Laden wird von $ templateCache verfügbar sein, ohne dass irgendein Ajax für Schablone.

Ich hoffe, dies wird keine Endlosschleife verursachen. als ob du momentan ein Problem hast.

Danke.

Quelle

2015-01-23 17:20:53

@Le Coder hilft mir meine Antwort? –

AngularJS ng-include tun HistoryJS aufhören zu arbeiten

Antwort

Verwandte Themen