Ich habe so sehr versucht, diese Arbeit zu bekommen, aber alle meine Versuche scheiterten. Ich versuche, Angular Routing zu lernen, ich begann sehr einfach: erstellt 4 Dateien im selben Ordner: index.html, page1.html, page2.html und page3.html. diese ist die index.html:AngularJS Routing funktioniert nicht mit TemplateUrl?
<!DOCTYPE html>
<html lang="en">
<head>
<title>routing</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<script src="D:\Developer Library\MyAngular\angular.min.js"></script>
<script src="D:\Developer Library\MyAngular\Scripts\angular-route.js"></script>
<body ng-app="myApp">
<a href="#page1">one</a>
<a href="#page2">two</a>
<a href="#page3">three</a>
<div ng-view></div>
<script>
var app = angular.module('myApp', ['ngRoute']);
app.config(function ($routeProvider) {
$routeProvider
.when('/page1', { templateUrl: 'D:\Developer Library\dom\AngularRouting\page1.html' }).
when('/page2', { template: '<h1>page2.html</h1>' })//the template is working fine unlike templateUrl
.when('/page3', { template: '<h1>page3.html</h1>' });
//page1.html, page2.html, page3.html are just files holding headers with some text.-->
})
</script>
</body>
</html>
Ich habe diese Fehler im Konsolenfenster:
XMLHttpRequest cannot load file:///D:/Developer%20LibrarydomAngularRoutingpage1.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
und:
Error: [$compile:tpload] http://errors.angularjs.org/1.5.8/ $compile/tpload?p0=D%3ADeveloper%20LibrarydomAngularRoutingpage1.html&p1=-1&p2= at angular.min.js:6 at angular.min.js:156 at angular.min.js:131 at m.$eval (angular.min.js:145) at m.$digest (angular.min.js:142) at m.$apply (angular.min.js:146) at HTMLBodyElement. (angular.min.js:115) at Sf (angular.min.js:37) at HTMLBodyElement.d (angular.min.js:37)
ich jede mögliche Änderung vorgenommen, um es Arbeit zu bekommen: Ich änderte den Wert href der Ankerelemente zu /#/page1, #/page1, /page, page, I änderte auch den templateUrl Wert zu ähnlichen Werten (mein letzter Versuch war der volle Weg der Datei!) Ich bin wirklich verwirrt zwischen dem href Wert und dem ersten Parameter von when Methode und dem templateUrl, also habe ich einige Fragen, die ich denke wird mir helfen zu verstehen, wie Routing in eckigen:
Was jeder von ihnen bezieht sich auf: Sind die href und das erste Argument der when Methode gleich? Kann ich dem href Attribut einen beliebigen Wert zuweisen und im Argument when darauf verweisen?
Ist templareUrl Wert auf die Position der aktuellen Datei bezogen (index.html),
Was bedeutet die Hash-Symbol # bedeutet und warum es wichtig ist?
Geben Sie einen Pfad an, in dem Sie Ihre Anwendung gehostet haben statt 'D: \ ...' könnte es '\ Scripts \ angular-route.js' &' \ Scripts \ angular.min.js' sein –