Angularjs ng-view reagiert nicht

Ich spiele mit angularjs, und ich kann nicht den Grund finden, warum ng-view nicht funktioniert. Was mache ich falsch?Angularjs ng-view reagiert nicht

var app = angular.module('Demo', ['ngRoute']) 
 
.config(function ($routeProvider) { 
 
    $routeProvider.when('#/about', { 
 
     templateUrl: 'about.html', 
 
     controller: 'homeController' 
 
    }); 
 
    $routeProvider.when('#/contacts', { 
 
     template: 'contacts.html', 
 
     controller: 'contactsController' 
 
    }); 
 
}); 
 
app.controller('homeController', function ($scope) { 
 
    alert('homeController'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src=""//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.js""></script> 
 
<body ng-app> 
 
<div class="menu"> 
 
    <ul> 
 
     <li><a href="#/about">About</a></li> 
 
     <li><a href="#/contacts">Contacts</a></li> 
 
    </ul> 
 
</div> 
 

 
<div class="MainContent"> 
 
    <div ng-view></div> 
 
</div> 
 

 
<template id="about.html"> 
 
    about 
 
</template> 
 

 
<template id="contacts.html"> 
 
    contacts 
 
</template> 
 
    </body>

Quelle

2016-05-25 A191919

Es gibt ein paar Probleme hier:

Ihre Skript Quelle für Winkel-Route war in dem HTML-Teil falsch.
Ihr $ routeProvider.when Linien brauchen nicht '#', also habe ich sie entfernt.
Eine Ihrer Vorlagen verwendet templateUrl, die nicht korrekt war. Es sollte nur eine Vorlage sein: da Sie keine URL anrufen. Hier

ist ein Arbeits Plunker: https://plnkr.co/edit/GSoJ4sAxM8joH6zmrxjf?p=preview

var app = angular.module('demo', ['ngRoute']) 

// URLs should not have # in them 
.config(function ($routeProvider) { 
    $routeProvider.when('/about', { 
     template: 'about.html', 
     controller: 'homeController' 
    }); 
    $routeProvider.when('/contacts', { 
     template: 'contacts.html', 
     controller: 'contactsController' 
    }); 
}); 

app.controller('homeController', function ($scope) { 
    alert('homeController'); 
}); 

app.controller('contactsController', function ($scope) { 
    alert('contactsController'); 
});

Quelle

2016-05-25 22:04:40 Brian

Angularjs ng-view reagiert nicht

Antwort

Verwandte Themen