Esempio di routing AngularJS con parametri

Prima di scoprire come funziona il routing in Angular, diamo una rapida panoramica sulle applicazioni a pagina singola.

Cosa sono le applicazioni a pagina singola?

Le applicazioni a pagina singola o (SPA) sono applicazioni Web che caricano una singola pagina HTML e aggiornano dinamicamente la pagina in base all'interazione dell'utente con l'applicazione Web.

Cos'è il routing in AngularJS?

Routing in AngularJS è un metodo che consente di creare applicazioni a pagina singola. Consente di creare diverse URLper contenuti diversi nelle tue applicazioni web. Il routing di AngularJS aiuta anche a mostrare più contenuti a seconda del percorso scelto. È specificato nel URL dopo il simbolo #.

Prendiamo ad esempio un sito che è ospitato tramite il URL http://example.com/index.html.

In questa pagina, ospiteresti la pagina principale della tua applicazione. Supponiamo che l'applicazione stia organizzando un Evento e si voglia vedere quali sono i vari eventi in mostra, o si vogliano vedere i dettagli di un evento particolare o eliminare un evento. In un'applicazione Single Page, quando il routing è abilitato, tutte queste funzionalità sarebbero disponibili tramite i seguenti link

http://example.com/index.html#ShowEvent

http://example.com/index.html#DisplayEvent

http://example.com/index.html#DeleteEvent

Il simbolo # verrebbe utilizzato insieme ai diversi percorsi (ShowEvent, DisplayEvent e DeleteEvent).

Pertanto, se l'utente volesse vedere tutti gli eventi, verrebbe indirizzato al collegamento (http://example.com/index.html#ShowEvent), altro
Se volessero vedere solo un evento particolare verrebbero reindirizzati al collegamento ( http://example.com/index.html#DisplayEvent) o puoi
Se volessero eliminare un evento, verrebbero indirizzati al collegamento http://example.com/index.html#DeleteEvent.

Nota che il principale URL rimane invariato.

Aggiunta della rotta AngularJS utilizzando $routeProvider

Quindi, come abbiamo discusso in precedenza, i percorsi in AngularJS vengono utilizzati per indirizzare l'utente a una visualizzazione diversa dell'applicazione. E questo routing viene eseguito sulla stessa pagina HTML in modo che l'utente abbia l'esperienza di non aver lasciato la pagina.

Per implementare il routing, è necessario implementare nell'applicazione i seguenti passaggi principali in un ordine specifico.

Riferimento a angular-route.js. Questo è un JavaCopione file sviluppato da Google che possiede tutte le funzionalità di routing. Questo deve essere inserito nella tua applicazione in modo che possa fare riferimento a tutti i moduli principali necessari per il routing.
Il prossimo passo importante è aggiungere una dipendenza al modulo ngRoute dall'interno della tua applicazione. Questa dipendenza è necessaria affinché la funzionalità di routing possa essere utilizzata all'interno dell'applicazione. Se questa dipendenza non viene aggiunta, non sarà possibile utilizzare il routing all'interno dell'applicazione angular.JS.

Di seguito è riportata la sintassi generale di questa istruzione. Questa è solo una normale dichiarazione di un modulo con l'inclusione della parola chiave ngRoute.

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

Il passaggio successivo sarebbe configurare il tuo $routeProvider. Ciò è necessario per fornire i vari percorsi nella tua applicazione. Di seguito è riportata la sintassi generale di questa istruzione che è molto autoesplicativa. Afferma semplicemente che quando viene scelto il percorso rilevante, utilizzare il percorso per visualizzare la vista data all'utente.

when(path, route)

Collegamenti al tuo percorso dalla tua pagina HTML. Nella tua pagina HTML aggiungerai collegamenti di riferimento ai vari percorsi disponibili nella tua applicazione.

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

Infine sarebbe l'inclusione del file direttiva ng-view, che normalmente si troverebbe in un tag div. Questo verrebbe utilizzato per inserire il contenuto della vista quando viene scelto il percorso pertinente.

Esempio di routing AngularJS

Ora, diamo un'occhiata a un esempio di routing utilizzando i passaggi sopra menzionati.

Nel nostro esempio di routing AngularJS con parametri,

Presenteremo 2 collegamenti all'utente,

Uno è visualizzare gli argomenti per un file JS angolare ovviamente, e l'altro è per il Node.js .
Quando l'utente fa clic su uno dei collegamenti, verranno visualizzati gli argomenti di quel corso.

Passo 1) Includere il file angular-route come riferimento allo script.

Questo file di percorso è necessario per utilizzare le funzionalità di avere più percorsi e visualizzazioni. Questo file può essere scaricato dal sito Web angular.JS.

Passo 2) Aggiungi tag href che rappresenteranno i collegamenti a "Argomenti Angular JS" e "Argomenti Node JS".

Passo 3) Aggiungi un tag div con la direttiva ng-view che rappresenterà la vista.

Ciò consentirà l'inserimento della vista corrispondente ogni volta che l'utente fa clic su "Argomenti Angular JS" o "Argomenti Node JS".

Passo 4) Nel tag dello script per AngularJS, aggiungi il "modulo ngRoute" e il servizio "$routeProvider".

Code Spiegazione:

Il primo passo è assicurarsi di includere il modulo "ngRoute". Con questo in posizione, Angular gestirà automaticamente il routing nella tua applicazione. Il modulo ngRoute che è sviluppato da Google Possiede tutte le funzionalità necessarie per la gestione del routing. Aggiungendo questo modulo, l'applicazione comprenderà automaticamente tutti i comandi di routing.
Il $routeprovider è un servizio che Angular utilizza per ascoltare in background le rotte che vengono chiamate. Pertanto, quando l'utente fa clic su un collegamento, il provider di percorso in AngularJS lo rileverà e quindi deciderà quale percorso intraprendere.
Crea un percorso per il collegamento Angular: questo blocco significa che quando si fa clic sul collegamento Angular, inserire il file Angular.html e utilizzare anche il controller "AngularController" per elaborare qualsiasi logica aziendale.
Crea un percorso per il collegamento al nodo: questo blocco significa che quando si fa clic sul collegamento al nodo, inserire il file Node.html e utilizzare anche il controller "NodeController" per elaborare qualsiasi logica aziendale.

Passo 5) Il prossimo è aggiungere controller per elaborare la logica aziendale sia per AngularController che per NodeController.

In ogni controller, stiamo creando una serie di coppie chiave-valore per memorizzare i nomi e le descrizioni degli argomenti per ciascun corso. La variabile array "tutorial" viene aggiunta all'oggetto ambito per ciascun controller.

<!DOCTYPE html>
<html>
<head>
    <meta chrset="UTF 8">
</head>
<body ng-app="sampleApp">
<title>Event Registration</title>
<script src="https://code.angularjs.org/1.6.9/angular-route.js"></script>
<script src="https://code.angularjs.org/1.6.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.6.9/angular.js"></script>

<h1> Guru99 Global Event</h1>

<div class="container">
    <ul>
        <li><a href="#Angular">Angular JS Topics</a></li>
        <li><a href="#Node.html">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"}
        ]
    });

    sampleApp.controller('NodeController',function($scope){

        $scope.tutorial = [
            {Name:"Promises",Description :"Power of Promises"},
            {Name:"Event",Description :"Event of Node.js"},
            {Name:"Modules",Description :"Modules in Node.js"}
            ]
    });

</script>
</body>
</html>

Passo 6) Crea pagine chiamate Angular.html e Node.html. Per ogni pagina stiamo eseguendo i passaggi seguenti.

Questi passaggi garantiranno che tutte le coppie chiave-valore dell'array vengano visualizzate su ogni pagina.

Utilizzando la direttiva ng-repeat per esaminare ciascuna coppia chiave-valore definita nella variabile tutorial.
Visualizzazione del nome e della descrizione di ciascuna coppia chiave-valore.

Angular.html

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

Nodo.html

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

Se il codice viene eseguito correttamente, quando si esegue il codice nel browser verrà visualizzato il seguente output.

Produzione:

Se si fa clic sul collegamento Argomenti AngularJS verrà visualizzato l'output seguente.

L’output mostra chiaramente che,

Quando si fa clic sul collegamento "Angular JS Topics", il routeProvider che abbiamo dichiarato nel nostro codice decide che il codice Angular.html deve essere iniettato.
Questo codice verrà inserito nel tag "div", che contiene la direttiva ng-view. Inoltre, il contenuto della descrizione del corso proviene dalla "variabile tutorial" che faceva parte dell'oggetto scope definito in AngularController.
Quando si fa clic su Node.js Argomenti, si verificherà lo stesso risultato e verrà visualizzata la vista per gli argomenti Node.js.
Inoltre, notate che la pagina URL rimane lo stesso, è solo il percorso dopo il tag # che cambia. E questo è il concetto di applicazioni a pagina singola. Il tag #hash nel URL è un separatore che separa il percorso (che nel nostro caso è 'Angular', come mostrato nell'immagine sopra) dalla pagina HTML principale (Sample.html).

Creazione di un percorso predefinito in AngularJS

Il routing in AngularJS offre anche la possibilità di avere un percorso predefinito. Questo è il percorso che viene scelto se non esiste corrispondenza per il percorso esistente.

Il percorso predefinito viene creato aggiungendo la seguente condizione durante la definizione del servizio $routeProvider.

La sintassi seguente significa semplicemente reindirizzare a una pagina diversa se uno qualsiasi dei percorsi esistenti non corrisponde.

otherwise ({
    redirectTo: 'page'
});

Usiamo lo stesso esempio sopra e aggiungiamo un percorso predefinito al nostro servizio $routeProvider.

function($routeProvider){
$routeProvider.

when('/Angular',{
templateUrl : 'Angular.html',
controller: 'AngularController'
}).

when("/Node", {
templateUrl: 'Node.html',
controller: 'NodeController'
}).
otherwise({
    redirectTo:'/Angular'
});
}]);

Code Spiegazione:

Qui stiamo usando lo stesso codice di cui sopra con l'unica differenza che stiamo usando l'istruzione Otherwise e l'opzione "redirectTo" per specificare quale vista deve essere caricata se non è specificato alcun percorso. Nel nostro caso vogliamo che venga mostrata la vista '/Angular'.

Se il codice viene eseguito correttamente, quando si esegue il codice nel browser verrà visualizzato il seguente output.

Produzione:

Dall'uscita,

Puoi vedere chiaramente che la vista predefinita mostrata è la vista JS angolare.
Questo perché quando la pagina viene caricata, passa all'opzione 'otherwise' nella funzione $routeProvider e carica la vista '/Angular'.

Come accedere ai parametri dalla rotta AngularJS

Angular fornisce anche la funzionalità per fornire parametri durante il routing. I parametri vengono aggiunti alla fine del percorso nel URL, per esempio, http://guru99/index.html#/Angular/1. In questo esempio di routing angolare,

, http://guru99/index.html è la nostra applicazione principale URL
Il simbolo # è il separatore tra l'applicazione principale URL e il percorso.
Angolare è il nostro percorso
E infine "1" è il parametro che viene aggiunto al nostro percorso

La sintassi di come appaiono i parametri nel URL è mostrato di seguito:

Pagina HTML#/percorso/parametro

Qui noterai che il parametro viene passato dopo il percorso nel URL.

Quindi nel nostro esempio di percorsi AngularJS, sopra per gli argomenti Angular JS, possiamo passare i parametri come mostrato di seguito

Esempio.html#/Angular/1

Esempio.html#/Angular/2

Esempio.html#/Angular/3

Qui i parametri di 1, 2 e 3 possono effettivamente rappresentare il topicid.

Diamo un'occhiata in dettaglio a come possiamo implementare la rotta angolare con parametro:

Passaggio 1) Aggiungi il seguente codice alla tua vista

Aggiungi una tabella per mostrare all'utente tutti gli argomenti del corso Angular JS
Aggiungi una riga di tabella per mostrare l'argomento "Controller". Per questa riga, cambia il tag href in "Angular/1", il che significa che quando l'utente fa clic su questo argomento, il parametro 1 verrà passato nel URL insieme al percorso.
Aggiungi una riga di tabella per mostrare l'argomento "Modelli". Per questa riga, cambia il tag href in "Angular/2", il che significa che quando l'utente fa clic su questo argomento, il parametro 2 verrà passato nel URL insieme al percorso.
Aggiungi una riga di tabella per mostrare l'argomento "Direttive". Per questa riga, cambia il tag href in "Angular/3", il che significa che quando l'utente fa clic su questo argomento, il parametro 3 verrà passato nel URL insieme al percorso.

Passaggio 2) Aggiungi l'ID argomento nella funzione del servizio Routeprovider
Nella funzione di servizio routeprovider, aggiungi:topicId per indicare che qualsiasi parametro passato nel URL dopo il percorso dovrebbe essere assegnato alla variabile topicId.

Passaggio 3) Aggiungere il codice necessario al controller

Assicurati di aggiungere prima "$routeParams" come parametro quando definisci la funzione del controller. Questo parametro avrà accesso a tutti i parametri di percorso passati nel URL.
Il parametro "routeParams" ha un riferimento all'oggetto topicId, che viene passato come parametro di route. Qui stiamo allegando la variabile '$routeParams.topicId' al nostro oggetto scope come variabile '$scope.tutotialid'. Questo viene fatto in modo che possa essere referenziato a nostro avviso tramite la variabile tutorialid.

<!DOCTYPE html>
<html>
<head>

    <meta chrset="UTF 8">
    <title>Event Registration</title>
</head>
<body ng-app="sampleApp">

<script src="https://code.angularjs.org/1.6.9/angular-route.js"></script>
<script src="https://code.angularjs.org/1.6.9/angular.min.js"></script>
<script src="lib/bootstrap.js"></script>
<script src="lib/bootstrap.css"></script>

<h1> Guru99 Global Event</h1>
<table class="table table-striped">
    <thead>
    <tr> <th>#</th><th>Angular JS topic</th><th>Description</th><th></th> </tr> </thead>
    <tbody>
    <tr>
        <td>l</td><td>l</td><td>Controllers</td>
        <td><a href="#Angular/l">Topic details</a></td>
    </tr>
    <tr>
        <td>2</td><td>2</td><td>Models</td>
        <td><a href="#Angular/2">Topic details</a></td>
    </tr>
    <tr>
        <td>3</td><td>3</td><td>Directives</td>
        <td><a href="#Angular/3">Topic details</a></td>
    </tr>
    </tbody>
</table>

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

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

    sampleApp.controller('AngularController',function($scope,$routeParams) {

        $scope.tutorialid=$routeParams.topicId

    });
</script>
</body>
</html>

Passaggio 4) Aggiungi l'espressione alla variabile visualizzata
Aggiungi l'espressione per visualizzare la variabile tutorialid nella pagina Angular.html.

<h2>Anguler</h2>

<br><br>{{tutorialid}}

Se il codice viene eseguito correttamente, quando si esegue il codice nel browser verrà visualizzato il seguente output.

Produzione:

Nella schermata di output,

Se fai clic sul collegamento Dettagli argomento per il primo argomento, il numero 1 viene aggiunto al URL.
Questo numero verrà quindi preso come argomento "routeparam" dal servizio router provider Angular.JS e sarà quindi accessibile al nostro controller.

Come utilizzare il servizio Angular $route

Il servizio $route consente di accedere alle proprietà del percorso. Il servizio $route è disponibile come parametro quando la funzione è definita nel controller. Di seguito è mostrata la sintassi generale di come il parametro $route è disponibile dal controller;

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

myApp è il modulo angular.JS definito per le tue applicazioni
MyController è il nome del controller definito per la tua applicazione
Proprio come viene resa disponibile per la tua applicazione la variabile $scope, che viene utilizzata per passare informazioni dal controller alla vista. Il parametro $route viene utilizzato per accedere alle proprietà del percorso.

Diamo un'occhiata a come possiamo utilizzare il servizio $route.

In questo esempio,

Creeremo una semplice variabile personalizzata chiamata "mytext", che conterrà la stringa "This is angolare".
Stiamo per collegare questa variabile alla nostra route. E più tardi accederemo a questa stringa dal nostro controller usando il servizio $route e quindi useremo successivamente l'oggetto scope per visualizzarla nella nostra view.

Vediamo quindi i passi che dobbiamo compiere per raggiungere questo obiettivo.

Passo 1) Aggiungi una coppia chiave-valore personalizzata al percorso. Qui aggiungiamo una chiave chiamata "miotesto" e le assegniamo il valore "Questo è angolare".

Passo 2) Aggiungere il codice pertinente al controller

Aggiungi il parametro $route alla funzione del controller. Il parametro $route è un parametro chiave definito in angular, che consente di accedere alle proprietà del percorso.
È possibile accedere alla variabile "mytext" definita nel percorso tramite il riferimento $ route.current. Questo viene quindi assegnato alla variabile 'text' dell'oggetto scope. È quindi possibile accedere alla variabile testo dalla vista di conseguenza.

<!DOCTYPE html>
<html>
<head>

    <meta chrset="UTF 8">
    <title>Event Registration</title>
</head>
<body ng-app="sampleApp">

<script src="https://code.angularjs.org/1.6.9/angular-route.js"></script>
<script src="https://code.angularjs.org/1.6.9/angular.min.js"></script>
<script src="lib/bootstrap.js"></script>
<script src="lib/bootstrap.css"></script>

<h1> Guru99 Global Event</h1>
<table class="table table-striped">
    <thead>
    <tr> <th>#</th><th>Angular JS topic</th><th>Description</th><th></th> </tr> </thead>
    <tbody>
    <tr>
        <td>l</td><td>l</td><td>Controllers</td>
        <td><a href="#Angular/l">Topic details</a></td>
    </tr>
    <tr>
        <td>2</td><td>2</td><td>Models</td>
        <td><a href="#Angular/2">Topic details</a></td>
    </tr>
    <tr>
        <td>3</td><td>3</td><td>Directives</td>
        <td><a href="#Angular/3">Topic details</a></td>
    </tr>
    </tbody>
</table>

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

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

    sampleApp.controller('AngularController',function($scope,$routeParams,$route) {

        $scope.tutorialid=$routeParams.topicId;
        $scope.text=$route.current.mytext;

    });
</script>
</body>
</html>

Passo 3) Aggiungi un riferimento alla variabile text dall'oggetto scope come espressione. Questo verrà aggiunto alla nostra pagina Angular.html come mostrato di seguito.

Ciò farà sì che il testo "Questo è angolare" venga inserito nella vista. L'espressione {{tutorialid}} è la stessa vista nell'argomento precedente e mostrerà il numero '1'.

<h2>Anguler</h2>

<br><br>{{text}}

<br><br>

Se il codice viene eseguito correttamente, quando si esegue il codice nel browser verrà visualizzato il seguente output.

Produzione:

Dall'uscita,

Possiamo vedere che il testo "Questo è angolare" viene visualizzato anche quando facciamo clic su uno qualsiasi dei collegamenti nella tabella. Anche l'ID dell'argomento viene visualizzato contemporaneamente al testo.

Abilitazione del routing HTML5

Il routing HTML5 viene utilizzato principalmente per creare pulito URL. Significa la rimozione dell'hashtag da URLQuindi il percorso URLQuando si utilizza il routing HTML5, l'aspetto sarà quello mostrato di seguito.

Esempio.html/Angular/1

Esempio.html/Angular/2

Esempio.html/Angular/3

Questo concetto è normalmente noto come presentazione piuttosto URL per l'utente.

Ci sono 2 passaggi principali che devono essere eseguiti per il routing HTML5.

Configurazione di $locationProvider
Impostazione della nostra base per i collegamenti relativi

Esaminiamo nel dettaglio come eseguire i passaggi sopra menzionati nel nostro esempio sopra

Passo 1) Aggiungi il codice pertinente al modulo angolare

Aggiungi una baseURL costante per l'applicazione – Questo è necessario per il routing HTML5 in modo che l'applicazione sappia qual è la posizione base dell'applicazione.
Aggiungi i servizi $locationProvider. Questo servizio ti consente di definire la modalità html5.
Imposta html5Mode del servizio $locationProvider su true.

Passo 2) Rimuovi tutti i tag # dai link ('Angular/1', 'Angular/2', 'Angular/3') per creare link di facile lettura URL.

<!DOCTYPE html>
<html>
<head>

    <meta chrset="UTF 8">
    <title>Event Registration</title>
</head>
<body ng-app="sampleApp">

<script src="https://code.angularjs.org/1.6.9/angular-route.js"></script>
<script src="https://code.angularjs.org/1.6.9/angular.min.js"></script>
<script src="lib/bootstrap.js"></script>
<script src="lib/bootstrap.css"></script>

<h1> Guru99 Global Event</h1>
<table class="table table-striped">
    <thead>
    <tr> <th>#</th><th>Angular JS topic</th><th>Description</th><th></th> </tr> </thead>
    <tbody>
    <tr>
        <td>l</td><td>l</td><td>Controllers</td>
        <td><a href="Angular/l">Topic details</a></td>
    </tr>
    <tr>
        <td>2</td><td>2</td><td>Models</td>
        <td><a href="Angular/2">Topic details</a></td>
    </tr>
    <tr>
        <td>3</td><td>3</td><td>Directives</td>
        <td><a href="Angular/3">Topic details</a></td>
    </tr>
    </tbody>
</table>

<script>
    var sampleApp = angular.module('sampleApp',['ngRoute']);
    sampleApp.constant("baseUrl","http://localhost:63342/untitled/Sample.html/Angular");

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

    sampleApp.controller('AngularController',function($scope,$routeParams,$route) {

        $scope.tutorialid=$routeParams.topicId

    });
</script>
</body>
</html>

Se il codice viene eseguito correttamente, quando si esegue il codice nel browser verrà visualizzato il seguente output.

Produzione:

Dall'uscita,

Puoi vedere che il tag # non è presente quando accedi all'applicazione.

Sintesi

Il routing viene utilizzato per presentare diverse visualizzazioni all'utente sulla stessa pagina web. Questo è fondamentalmente il concetto utilizzato nelle applicazioni a pagina singola implementate per quasi tutte le applicazioni Web moderne
È possibile impostare un percorso predefinito per il routing angular.JS. Viene utilizzato per determinare quale sarà la visualizzazione predefinita da mostrare all'utente
I parametri possono essere passati al percorso tramite il URL come parametri di percorso. Questi parametri vengono poi successivamente utilizzati tramite il parametro $routeParams nel controller.
Il servizio $route può essere utilizzato per definire coppie chiave-valore personalizzate nel percorso a cui è possibile accedere successivamente dall'interno della vista
Il routing HTML5 viene utilizzato per rimuovere il tag # dal routing URL in angolare per formare piuttosto URL

Esempio di routing AngularJS con parametri

Cosa sono le applicazioni a pagina singola?

Cos'è il routing in AngularJS?

Aggiunta della rotta AngularJS utilizzando $routeProvider

Esempio di routing AngularJS

Creazione di un percorso predefinito in AngularJS

Come accedere ai parametri dalla rotta AngularJS

Come utilizzare il servizio Angular $route

Abilitazione del routing HTML5

Sintesi

Riassumi questo post con:

Iscriviti alla newsletter

Cosa sono le applicazioni a pagina singola?

Cos'è il routing in AngularJS?

Aggiunta della rotta AngularJS utilizzando $routeProvider

ARTICOLI CORRELATI

Esempio di routing AngularJS

Creazione di un percorso predefinito in AngularJS

Come accedere ai parametri dalla rotta AngularJS

Come utilizzare il servizio Angular $route

Abilitazione del routing HTML5

Sintesi

Riassumi questo post con:

Iscriviti alla newsletter