2016-04-19 4 views
0

Mein Winkel Routing funktioniert nicht (Klick Link verursacht keine Routenänderung):Angular Routing funktioniert nicht

var smu72App = angular.module("smu72App", [ 
     "ngRoute" 
]). 
    config(function ($routeProvider, $locationProvider) { 
     $routeProvider 
      .when("/", { 
       templateUrl: "/templates/home.html", 
       controller: 'smu72Controller' 
      }) 
      .when("/objects", { 
       templateUrl: "/templates/objects.html", 
       controller: 'smu72Controller' 
      }) 
      .when("/object/:Id", { 
       templateUrl: '/templates/object.html', 
       controller: 'smu72Controller' 
      }) 
     .otherwise({ 
      redirectTo: "/" 
     }); 
     $locationProvider.html5Mode(true); 
    }); 

Das Haupt-Seite ist, die ng-Ansicht (zerschnitt ein bisschen für eine bessere Lesung) halten:

<!DOCTYPE html> 
<html ng-app="smu72App"> 
.... 
    <base href="/"> 
..... 
<body data-spy="scroll" data-target="#navbar" data-offset="0"> 
    ... 
       <div class="collapse navbar-collapse"> //THAT'S SCROLLSPY LINKS (NOT ANGULAR) 
        <ul class="nav navbar-nav"> 
         <li class="active"><a href="/"><i class="fa fa-home" aria-hidden="true"></i></a></li> 
         <li><a href="#services"> УСЛУГИ</a></li> 
         <li><a href="#portfolio"> OБЪЕКТЫ</a></li> 
         <li><a href="#about-us"> OТЗЫВЫ</a></li> 
         <li><a href="#certificates"> СЕРТИФИКАТЫ</a></li> 
         <li><a href="#contact"> КОНТАКТЫ</a></li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    <div ng-view></div> 
    ... 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 
    <script src="https://code.angularjs.org/1.5.3/angular-route.min.js"></script> 
    <script src="https://code.angularjs.org/1.5.3/angular-resource.min.js"></script> 
    <script src="Scripts/simplbox.min.js"></script> 
    <script src="http://localhost:25018/Scripts/main.js"></script> 
    <script src="http://localhost:25018/Scripts/app.js"></script> 
    <script src="http://localhost:25018/Scripts/smu72Controller.js"></script> 
</body> 
</html> 
+2

Try 'smu72App.config' statt' var erstellen smu72App = Agular .module ("smu72App", ["ngRoute"]). config' Hoffe diese Hilfe. – DieuNQ

+0

Es funktioniert nicht so gut. –

Antwort

0

erklären Sie Ihre Modul zuerst

angular.module("smu72App", ["ngRoute"]); 

Dann Config initialisieren

angular.module("smu72App").config("....ur routes in here"); 

Erhalten Sie irgendwelche Konsolenfehler?

Ich habe bemerkt, dass etwas mehr, dass ur Anker-Tag href nicht mit den Routen in Ihrem Konfig-Abschnitt außer Ihrer Homepage übereinstimmt und deshalb Ihre Startseite wird geladen.

Nur ein Beispiel versuchen ur Anker-Tag wie diese <a href="#/about"> oder wie <a href="/about"> Coz Ich denke, ur nicht Hash mit und ur Route wie unter

$routeProvider.when('/about', { 
     templateUrl: 'partials/about.html', 
     controller: 'AboutCtrl' 
    }); 
+0

Nein, es gibt keine Fehler in der Konsole, auch dies funktioniert nicht. –

+0

Erhalten Sie Ihre home.html Seite? –

+0

Ja, die Standardvorlage (home.html) wird geladen, aber die Links zu den anderen Vorlagen funktionieren nicht. –