AngularJs-routing med parametre

Før vi ser på, hvordan routing fungerer i AngularJS, er det nyttigt at forstå, hvilken type applikationsrouting er bygget til. Afsnittet nedenfor sætter denne kontekst, og alle de efterfølgende teknikker bygger videre på den.

Hvad er Single Page Applications?

Enkeltsidede applikationer, eller SPA'er, er webapplikationer, der indlæser en enkelt HTML-side og derefter opdaterer siden dynamisk, når brugeren interagerer med den. I stedet for at anmode om et nyt dokument fra serveren for hvert klik, udskifter en SPA kun den del af siden, der er ændret.

Det design skaber ét problem. Hvis browseren aldrig navigerer til et nyt dokument, ændres adresselinjen aldrig, så brugeren kan ikke bogmærke en skærm, dele den eller bruge tilbageknappen. Routing løser præcis dette problem.

Hvad er Routing i AngularJS?

Routing i AngularJS er en metode, der giver dig mulighed for at oprette enkeltsidede applikationer. Den giver dig mulighed for at oprette forskellige URLs for forskelligt indhold i dine webapplikationer. AngularJS-routing hjælper også med at vise flere forskellige indholdstyper afhængigt af hvilken rute der vælges. Det er specificeret i URL efter #-tegnet.

Lad os tage et eksempel på en hjemmeside, der hostes via URL http://example.com/index.html.

Denne side er hovedskærmen i din applikation. Antag, at applikationen organiserer en begivenhed, og brugeren ønsker at liste begivenhederne, se en detaljeret eller slette en. I en Single Page-applikation med routing aktiveret er alt dette tilgængeligt via følgende links.

Symbolet # vil blive brugt sammen med de forskellige ruter (ShowEvent, DisplayEvent og DeleteEvent).

• For at se alle begivenheder, bliver brugeren dirigeret til http://example.com/index.html#ShowEvent
• For at se én bestemt begivenhed bliver de henvist til http://example.com/index.html#DisplayEvent
• For at slette en begivenhed, bliver de henvist til http://example.com/index.html#DeleteEvent

Bemærk at det vigtigste URL forbliver det samme. Kun fragmentet efter # ændres, og det er det fragment, AngularJS overvåger. Med konceptet etableret dækker næste afsnit de dele, du skal forbinde, før noget af det fungerer.

Tilføjelse af AngularJS Route ved hjælp af $routeProvider

Som tidligere nævnt, ruter i AngularJS bruges til at dirigere brugeren til en anden visning af din applikation. Denne routing udføres på den samme HTML-side, så brugeren har oplevelsen af, at de ikke har forladt siden.

For at implementere routing skal følgende hovedtrin implementeres i din applikation i en given rækkefølge.

1. Reference angular-route.js. Dette JavaScript fil, udviklet af Google, indeholder al routingfunktionalitet og skal inkluderes, så applikationen kan referere til modulernes routingbehov.
2. Tilføj en afhængighed til ngRoute-modulet indefra din applikation. Uden denne afhængighed kan routing slet ikke bruges i AngularJS-applikationen.

Nedenfor er den generelle syntaks for denne erklæring. Dette er blot en normal erklæring af et modul med inklusion af nøgleordet ngRoute.

var module = angular.module("sampleApp", ['ngRoute']);

3. Konfigurer din $routeProvider. Denne leverer de forskellige ruter i din applikation, og syntaksen angiver blot, at når den relevante sti er valgt, skal ruten bruges til at vise den givne visning.

when(path, route)

4. Links til din rute fra din HTML-side. På din HTML-side vil du tilføje referencelinks til de forskellige tilgængelige ruter i din applikation.

<a href="#!/route1">Route 1</a><br/>

5. Endelig ville være inddragelsen af ng-view direktiv, som normalt ville være i et div-tag. Dette vil blive brugt til at injicere indholdet af visningen, når den relevante rute er valgt.

💡 Tip: Alle fem trin er obligatoriske. En manglende angular-route.js-reference er den mest almindelige årsag til, at en rute ikke gør noget i stilhed, fordi $routeProvider ikke eksisterer uden den. I næste afsnit samles alle fem i et fungerende eksempel.

AngularJS Routing Eksempel

Lad os nu se på et eksempel på routing ved hjælp af de ovennævnte trin.

I vores AngularJS routing eksempel med parametre,

• Et link er til at vise emnerne for en AngularJS kursus, og den anden er til node.js kursus.
• Når brugeren klikker på et af linkene, vil emnerne for det pågældende kursus blive vist.

Trin 1) Inkluder angular-route-filen som en scriptreference.

Denne rutefil er nødvendig for at kunne udnytte funktionerne ved at have flere ruter og visninger. Denne fil kan downloades fra AngularJS' hjemmeside.

Trin 2) Tilføj href-tags, som repræsenterer links til "Angular JS Topics" og "Node JS Topics".

Trin 3) Tilføj et div-tag med ng-view-direktivet, som repræsenterer visningen.

Dette vil tillade den tilsvarende visning at blive injiceret, hver gang brugeren klikker på enten "Angular JS Topics" eller "Node JS Topics".

Trin 4) Tilføj "ngRoute-modulet" og "$routeProvider"-tjenesten i dit script-tag til AngularJS.

Code Forklaring:

1. Inkluder "ngRoute-modulet". Når dette er på plads, håndterer Angular routing automatisk og forstår alle routing-kommandoerne.
2. $routeProvider er en tjeneste, der lytter i baggrunden til de ruter, der kaldes. Når brugeren klikker på et link, registrerer den dette og beslutter, hvilken rute der skal tages.
3. Opret én rute til Angular-linket: når der klikkes på det, injiceres Angular.html, og 'AngularController' bruges til forretningslogikken.
4. Opret én rute til Node-linket, som indsprøjter Node.html og bruger 'NodeController' på samme måde.

Trin 5) Det næste er at tilføje controllere til at behandle forretningslogikken for både AngularController og NodeController.

I hver controller opretter vi et array af nøgle-værdi-par for at gemme emnenavne og beskrivelser for hvert kursus. Arrayvariablen 'tutorial' tilføjes til scope-objektet for hver controller.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Event Registration</title>
</head>
<body ng-app="sampleApp">

<script src="https://code.angularjs.org/1.8.3/angular.min.js"></script>
<script src="https://code.angularjs.org/1.8.3/angular-route.js"></script>

<h1> Guru99 Global Event</h1>

<div class="container">
<ul>
<li><a href="#!/Angular">Angular JS Topics</a></li>
<li><a href="#!/Node">Node JS Topics</a></li>
</ul>
<div ng-view></div>
</div>

<script>
var sampleApp = angular.module('sampleApp', ['ngRoute']);

sampleApp.config(['$routeProvider',
function($routeProvider) {
  $routeProvider.
  when('/Angular', {
    templateUrl: 'Angular.html',
    controller: 'AngularController'
  }).
  when('/Node', {
    templateUrl: 'Node.html',
    controller: 'NodeController'
  });
}]);

sampleApp.controller('AngularController', function($scope) {
  $scope.tutorial = [
    {Name: "Controllers", Description: "Controllers in action"},
    {Name: "Models", Description: "Models and binding data"},
    {Name: "Directives", Description: "Flexibility of Directives"}
  ];
});

// NodeController follows the same shape with Node.js topics
sampleApp.controller('NodeController', function($scope) {
  $scope.tutorial = [{Name: "Promises", Description: "Power of Promises"}];
});
</script>
</body>
</html>

⚠️ Rettelser anvendt. <title> mærket sad indeni <body>, chrset="UTF 8" var stavet forkert, det andet link pegede på #Node.html i stedet for den registrerede rute /Node, og skabelonstier havde en indledende skråstreg, der opløses fra domæneroden.

Trin 6) Opret sider kaldet Angular.html og Node.html. For hver side udfører vi nedenstående trin.

Disse trin sikrer, at alle nøgleværdi-par i arrayet vises på hver side.

1. Brug af ng-gentag direktiv at gennemgå hvert nøgle-værdi-par, der er defineret i vejledningsvariablen.
2. Viser navn og beskrivelse af hvert nøgleværdi-par.

• Angular.html

<h2>Angular</h2>
<ul ng-repeat="ptutor in tutorial">
<li>Course : {{ptutor.Name}} - {{ptutor.Description}}</li>
</ul>

• Node.html — identisk med ovenstående liste, men overskriften er ændret til "Node". Begge skabeloner lyder ens. tutorial variabel, som hver controller leverer fra sit eget scope.

⚠️ Rettelse: Overskriften i den originale Angular.html lød "Anguler". Stavningen er rettet ovenfor.

Hvis koden udføres korrekt, vises følgende output, når du kører din kode i browseren.

Output:

Hvis du klikker på linket AngularJS Topics, vises nedenstående output.

Outputtet viser tydeligt, at

• Når der klikkes på linket "Angular JS Topics", beslutter ruteudbyderen, som vi har erklæret i vores kode, at Angular.html-koden skal injiceres.
• Denne kode vil blive injiceret i "div"-tagget, som indeholder ng-view-direktivet. Desuden kommer indholdet af kursusbeskrivelsen fra "tutorial-variablen", som var en del af scope-objektet defineret i AngularController.
• Når man klikker på node.js Emner, det samme resultat vil finde sted, og visningen for Node.js-emner vil blive manifesteret.
• Bemærk også, at siden URL forbliver den samme. Det er kun ruten efter #-tagget, der ændrer sig, og det er konceptet med enkeltsidede applikationer. #hash-tagget i URL er en separator mellem ruten (som i vores tilfælde er 'Angular') og den primære HTML-side (Sample.html).

Eksemplet fungerer kun, når brugeren klikker på et link, der matcher en registreret rute. Det næste afsnit omhandler, hvad der skal ske, når intet matcher.

Oprettelse af en standardrute i AngularJS

Routing i AngularJS giver også mulighed for at have en standardrute. Dette er den rute, der vælges, hvis der ikke er match for den eksisterende rute.

Standardruten oprettes ved at tilføje følgende betingelse, når du definerer $routeProvider-tjenesten.

Syntaksen nedenfor betyder blot at omdirigere til en anden side, hvis en af ​​de eksisterende ruter ikke matcher.

otherwise({
  redirectTo: 'page'
});

Lad os bruge det samme eksempel ovenfor og tilføje en standardrute til vores $routeProvider-tjeneste.

sampleApp.config(['$routeProvider',
function($routeProvider) {
  $routeProvider.
  when('/Angular', {
    templateUrl: 'Angular.html',
    controller: 'AngularController'
  }).
  when('/Node', {
    templateUrl: 'Node.html',
    controller: 'NodeController'
  }).
  otherwise({
    redirectTo: '/Angular'
  });
}]);

Code Forklaring:

1. Her bruger vi den samme kode som ovenfor, med den eneste forskel at vi bruger otherwise-sætningen og "redirectTo"-indstillingen til at angive hvilken visning der skal indlæses, hvis der ikke er angivet en rute. I vores tilfælde ønsker vi at vise '/Angular'-visningen.

Hvis koden udføres korrekt, vises følgende output, når du kører din kode i browseren.

Output:

Fra udgangen,

• Du kan tydeligt se, at standardvisningen, der vises, er AngularJS-visningen.
• Dette skyldes, at når siden indlæses, går den til 'otherwise'-indstillingen i $routeProvider-funktionen og indlæser '/Angular'-visningen.

En standardrute bestemmer, hvilken visning der indlæses. Det næste afsnit dækker, hvordan en enkelt rute kan betjene mange poster ved at bære en værdi i URL.

Sådan får du adgang til parametre fra AngularJS-ruten

Angular giver også funktionalitet til at overføre parametre under routing. Parametrene tilføjes til slutningen af ​​ruten i URL, For eksempel, http://guru99/index.html#/Angular/1. I dette eksempel på Angular routing,

1. http://guru99/index.html er vores primære applikation URL
2. Symbolet # er skilletegnet mellem hovedapplikationen URL og ruten
3. Kantet er vores rute
4. Og endelig er '1' parameteren, som tilføjes til vores rute

Den generelle syntaks er HTMLPage#/rute/parameter, så de tidligere emner bliver Sample.html#/Angular/1, #/Angular/2 og #/Angular/3, hvor cifferet er emne-id'et.

Lad os se nærmere på, hvordan vi kan implementere en Angular-rute med en parameter.

Trin 1) Tilføj følgende kode til din visning

1. Tilføj en tabel for at vise alle emnerne for Angular JS-kurset til brugeren.
2. Tilføj en tabelrække for at vise emnet "Controllere". For denne række skal du indstille href til "#!/Angular/1", så et klik på emnet overfører parameter 1 i URL sammen med ruten.
3. Tilføj en række for emnet "Modeller" med href sat til "#!/Angular/2", så parameter 2 bevæger sig i URL.
4. Tilføj en række for emnet "Direktiver" med href sat til "#!/Angular/3", så parameter 3 bevæger sig i URL.

Trin 2) Tilføj emne-id i routeProvider-tjenestefunktionen
I routeProvider-servicefunktionen skal du tilføje :topicId pladsholder til at angive, at enhver parameter, der sendes i URL efter ruten skal tildeles variablen topicId.

Trin 3) Tilføj den nødvendige kode til controlleren

1. Sørg for først at tilføje "$routeParams" som en parameter, når du definerer controllerfunktionen. Denne parameter vil have adgang til alle de ruteparametre, der sendes i URL.
2. "$routeParams" indeholder det emne-ID, der er angivet i ruten. Vedhæfter $routeParams.topicId til omfanget som $scope.tutorialid gør den tilgængelig for visningen som tutorialid.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Event Registration</title>
</head>
<body ng-app="sampleApp">

<script src="https://code.angularjs.org/1.8.3/angular.min.js"></script>
<script src="https://code.angularjs.org/1.8.3/angular-route.js"></script>

<h1> Guru99 Global Event</h1>
<table class="table table-striped">
<tbody>
<tr><td>1</td><td>Controllers</td>
<td><a href="#!/Angular/1">Topic details</a></td></tr>
<!-- rows 2 and 3 repeat with /Angular/2 and /Angular/3 -->
</tbody>
</table>
<div ng-view></div>

<script>
var sampleApp = angular.module('sampleApp', ['ngRoute']);

sampleApp.config(['$routeProvider',
function($routeProvider) {
  $routeProvider.
  when('/Angular/:topicId', {
    templateUrl: 'Angular.html',
    controller: 'AngularController'
  });
}]);

sampleApp.controller('AngularController', ['$scope', '$routeParams',
function($scope, $routeParams) {
  $scope.tutorialid = $routeParams.topicId;
}]);
</script>
</body>
</html>

⚠️ Rettelser anvendt. Originalen brugte bogstavet l i stedet for cifferet 1 in href="#Angular/l", udeladte ng-view containeren, så skabelonen ikke havde noget sted at gengive, og indlæste angular-route.js før angular.min.js, hvilket kaster en modulfejl.

Trin 4) Tilføj udtrykket for at vise variablen
Tilføj udtrykket for at vise tutorialid-variablen på siden Angular.html.

<h2>Angular</h2>

<br><br>{{tutorialid}}

Hvis koden udføres korrekt, vises følgende output, når du kører din kode i browseren.

Output:

På outputskærmen,

• Hvis du klikker på linket Emnedetaljer for det første emne, tilføjes tallet 1 til URL.
• Dette tal tages som et "routeParams"-argument og bliver tilgængeligt i controlleren.

Det er ligetil at læse en parameter. Hentning af den post, som parameteren identificerer, før visningen vises, er den opgave, der dækkes i det følgende for den egenskab.

Sådan forudindlæses data med resolve-egenskaben

Controlleren i det forrige afsnit læser et emne-id og viser det med det samme. Virkelige applikationer skal først hente posten fra en server, og hvis visningen gengives, før anmodningen returneres, ser brugeren en tom skabelon, der udfyldes et øjeblik senere. resolve egenskaben fjerner det glimt af tomt indhold.

Hver tast indeni en resolve `objekt` er en afhængighed, som AngularJS forbereder, før ruten aktiveres. Hvis værdien er et `promise`, venter routeren på, at det afvikles. Først når hvert `promise` er opløst, instantierer AngularJS controlleren og gengiver skabelonen, og de opløste værdier injiceres i controlleren efter navn, præcis som enhver anden service.

sampleApp.config(['$routeProvider',
function($routeProvider) {
  $routeProvider.
  when('/Angular/:topicId', {
    templateUrl: 'Angular.html',
    controller: 'AngularController',
    resolve: {
      // The router waits for this promise before rendering
      topic: ['$http', '$route', function($http, $route) {
        var id = $route.current.params.topicId;
        return $http.get('/api/topics/' + id).then(function(response) {
          return response.data;
        });
      }]
    }
  });
}]);

// 'topic' is injected already resolved, so no loading state is needed
sampleApp.controller('AngularController', ['$scope', 'topic',
function($scope, topic) {
  $scope.topic = topic;
}]);

To adfærdsmønstre er vigtige her. Et afvist løfte annullerer ruteændringen og efterlader browseren i den aktuelle visning, så en mislykket anmodning aldrig producerer en ødelagt side. Men fordi routeren blokerer, mens løftet afventer, får et langsomt slutpunkt applikationen til at se frossen ud. resolve med en fremskridtsindikator drevet af $routeChangeStart og $routeChangeSuccess begivenheder.

⚠️ Advarsel: Placer aldrig kun autentificeringstjek indeni resolveAfvisning af en rute skjuler en visning, men beskytter ikke dataene bag den, og API-slutpunktet skal stadig håndhæve adgang på serveren.

Ud over at forudindlæse data kan en rute også indeholde statiske konfigurationsværdier. Den efterfølgende tjeneste omhandler, hvordan en controller læser dem.

Sådan bruges Angular $route Service

Tjenesten $route giver dig adgang til rutens egenskaber. Tjenesten $route er tilgængelig som en parameter, når funktionen er defineret i controlleren. Den generelle syntaks for, hvordan parameteren $route gøres tilgængelig fra controlleren, vises nedenfor.

myApp.controller('MyController', function($scope, $route) { ... });

1. myApp er AngularJS-modulet, der er defineret til din applikation.
2. MyController er navnet på den controller, der er defineret til din applikation.
3. Ligesom $scope sender information fra controlleren til viewet, eksponerer $route egenskaberne for den aktuelle rute.

Lad os se på, hvordan vi kan bruge $route-tjenesten.

I dette eksempel

• Vi vil oprette en simpel brugerdefineret variabel kaldet "mytext", som vil indeholde strengen "This is angular."
• Vi vil tilknytte denne variabel til vores rute. Later Vi skal tilgå denne streng fra vores controller ved hjælp af $route-tjenesten og derefter bruge scope-objektet til at vise den i vores view.

Så lad os se, hvilke skridt vi skal udføre for at opnå dette.

Trin 1) Tilføj et tilpasset nøgleværdi-par til ruten. Her tilføjer vi en nøgle kaldet 'mintekst' og tildeler den værdien "Dette er kantet."

Trin 2) Tilføj den relevante kode til controlleren.

1. Tilføj parameteren $route til controllerfunktionen. Parameteren $route er en nøgleparameter defineret i Angular, som giver adgang til rutens egenskaber.
2. Variablen "mytext" som blev defineret i ruten kan tilgås via $route.current referencen. Dette tildeles derefter til scope-objektets 'tekst'-variabel. Tekstvariablen kan derefter tilgås fra visningen i overensstemmelse hermed.

// Only the config and controller change; the page markup is unchanged
sampleApp.config(['$routeProvider',
function($routeProvider) {
  $routeProvider.
  when('/Angular/:topicId', {
    mytext: "This is angular",   // custom key attached to the route
    templateUrl: 'Angular.html',
    controller: 'AngularController'
  });
}]);

sampleApp.controller('AngularController', ['$scope', '$routeParams', '$route',
function($scope, $routeParams, $route) {
  $scope.tutorialid = $routeParams.topicId;
  $scope.text = $route.current.mytext;
}]);

Trin 3) Tilføj en reference til tekstvariablen fra scope-objektet som et udtryk. Dette vil blive tilføjet til vores Angular.html side som vist nedenfor.

Dette vil medføre, at teksten "This is angular" indsprøjtes i visningen. {{tutorialid}}-udtrykket er det samme som i det forrige emne, og dette vil vise tallet '1'.

<h2>Angular</h2>

<br><br>{{text}}
<br><br>{{tutorialid}}

Hvis koden udføres korrekt, vises følgende output, når du kører din kode i browseren.

Output:

Fra udgangen,

• Vi kan se, at teksten "This is angular" også bliver vist, når vi klikker på et af linkene i tabellen. Emne-id'et bliver også vist på samme tid som teksten.

Hver URL Det viste billede har stadig et #-symbol. Det fjernes i det sidste konfigurationstrin.

Aktivering af HTML5-routing

HTML5-routing bruges til at skabe rene URLs. Det betyder fjernelse af hashtagget fra URLSå ruten URLs, når HTML5-routing bruges, vil se ud som vist nedenfor.

Sample.html/Angular/1

Sample.html/Angular/2

Sample.html/Angular/3

Dette koncept er normalt kendt som at præsentere en smuk URL til brugeren.

Der er 2 hovedtrin, som skal udføres for HTML5-routing.

1. Konfigurerer $locationProvider
2. Sætter vores base for relative links

Lad os se nærmere på, hvordan du udfører ovennævnte trin i vores eksempel.

Trin 1) Tilføj den relevante kode til Angular-modulet.

1. Føj til <base> tag til dokumenthovedet. Dette er påkrævet for HTML5-routing, så applikationen ved, hvad applikationens basisplacering er.
2. Tilføj tjenesten $locationProvider. Denne tjeneste giver dig mulighed for at definere html5Mode.
3. Indstil html5Mode for $locationProvider-tjenesten til sand.

Trin 2) Fjern alle #-tags for linkene ('Angular/1', 'Angular/2', 'Angular/3') for at skabe letlæselige URLs.

<!-- In the head: required by html5Mode so relative templates resolve -->
<base href="/">

<!-- In the body: the # is dropped from every link -->
<a href="Angular/1">Topic details</a>

<script>
sampleApp.config(['$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.
  when('/Angular/:topicId', {
    templateUrl: 'Angular.html',
    controller: 'AngularController'
  });
}]);
</script>

⚠️ Rettelse: originalen erklærede en baseUrl konstant peger på en lokal IDE-sti, hvilket ikke har nogen effekt på html5Mode. AngularJS læser basisplaceringen fra <base href> tag. Originalen blev også injiceret $locationProvider uden nogensinde at ringe html5Mode(true), så hashen blev aldrig fjernet.

Hvis koden udføres korrekt, vises følgende output, når du kører din kode i browseren.

Output:

Fra udgangen,

• Du kan se, at #-tagget ikke er der, når du får adgang til applikationen.

Alt ovenfor bruger ngRoute, routeren leveret af AngularJS-teamet. Det er ikke den eneste mulighed, og sammenligningen nedenfor forklarer, hvornår alternativet er det bedre egnede.

ngRoute vs. ui-router: Hvilken router skal man vælge?

ngRoute vedligeholdes af AngularJS-teamet og matcher en URL direkte til en enkelt skabelon og controller. ui-router er et fællesskabsprojekt, der er bygget til at fjerne ngRoutes hovedbegrænsning: den matcher på applikationen tilstand snarere end på URL alene, hvilket tillader én skærm at indeholde flere uafhængigt rutede regioner.

Vælg ngRoute når hver URL kortlægges til én helsidesvisning, da den ikke kræver nogen ekstra afhængighed, og hele API'en passer på en enkelt side. Vælg ui-router, når en skærm har ruder, der navigerer uafhængigt, eller når undervisningsvisninger skal genbruge data, der er indlæst af en overordnet visning. Senere migrering er mulig, men ikke triviel, fordi tilstandsnavne erstatter URL mønstre i hele skabelonerne.

Almindelige AngularJS-routingfejl og hvordan man retter dem

De fleste routingfejl producerer en tom ng-view i stedet for en konsolfejl, hvilket gør dem sværere at diagnosticere end de burde være. Hvert symptom nedenfor angiver dets årsag og dets løsning.

• Ukendt udbyder: $routeProvider: angular-route.js blev aldrig indlæst, eller indlæst før angular.min.js. Se først kernebiblioteket.
• Visningen forbliver tom uden fejl: Intet element bærer ng-view-direktivet, så skabelonen har ingen steder at gengive.
• Intet indlæses ved første besøg: Ingen rute matcher den tomme sti. Tilføj en otherwise-blok med en redirectTo-værdi.
• $routeParams er tom: Mønsteret mangler sin kolonpladsholder. Det skal stå '/Angular/:topicId'.
• Skabeloner 404 efter html5Mode: konfigurer serveren til at omskrive uoverensstemmende stier til basissiden, og bekræft, at base href-tagget er til stede.
• Controlleren kører aldrig igen: Kun parameteren blev ændret, så AngularJS genbrugte controller-instansen i stedet for at genopbygge den. Lyt efter $routeUpdate-hændelsen i stedet for at stole på, at controllerfunktionen aktiveres igen.

Ofte Stillede Spørgsmål