Ir al contenido principal

AngularJS: Router

Router

  • Depends on angular-route.js
  • Rules are defined in $routeProvider
  • Normally defined in  app.js

  • $stateProvider is a better option



  • Create an index.html
    • Add the section <ng-view>  </ng-view>


  • In app.js file

var app = angular.module( "githubViewer", [ngRoute] );

app. config ( function ($routeProvider) {

        $routeProvider
                   .when("/main" , {
                            templateURL: "mypage.html",
  • The controller is optional, the other way is to include it in the html
                            controller: "MyController"              
                   })
  • Receiving paramenters
    • In the controller you have to use $routeParams to receive the parameters
      • var controller = function ($routeParams ){  -.....
      • param = routeParams.param1;
                      .when( "/user/:user", {
                                templateURL: "mypag2e.html",
                                controller: "MySecondController"


  • To wait until the data is fetch
                                resolve: {
                                       event : function($route, even){
                                                return even.getData().$promise;
                                          }

                                  }



                        })



                     .otherwise({redirection : "main.html"});

});


$route


  • Accesing paramenters through URL
URL:  index.html/4?paramenter=foo
$route.current.param.<parameter>   ( = foo)

$route.current.param.eventId   ( = 4)


$route.reload();


  • The references in the pages should be:   #/otherpage.html

Location


Use to move in the a specific part of the html page
  • In the controller you have to use $location to receive the parameters
    • var controller = function ($location ){  -.....
    • $location.path("/myPath/" + userName) ;


Move to another URL

$location..url('newURL')

Avoid the use of # in URL

  • Needs 'ngRoute'
$locationProvider.html5Mode({
enabled : true
});

  • Add in your main page
<base href="/index.html">



Get the string after #

  • location.hash()
  • Ex.- index.html/newEvent#quiz   (hash() = quiz)

Get Parameters

  • $location.search()
Replace in the history with the new pages

  • $location.replace()

  • $location.path()
  • $location.url()

ng-view

Section where the pages will be loaded








Comentarios

Publicar un comentario

Entradas populares de este blog

Android - Basic Steps (Service)

Service Run in the main thread of the hosting application Android can kill the Service if need the resources Purpose Supporting inter-application method execution Performing background processing Start a Service Call Context.startService(Intent intent)\ To call from a Fragment use getActivity().getApplicationContext().startService( intentService); Executing the service After call startService(...)  In the Service is executed the method onStartCommand(...) If the method returns the constant START_NOT_STICKY then Android will not restart the service automatically if the the process is killedp Foreground To execute the service foreground call the method startForeground() Use this if the user is aware of the process Bind to a Service Call the method Context.bindService( Intent service ServiceConnection con int flags ) Send Toast from the Service On the method onStartCommand receive the message   ...
Publicar un comentario
Leer más

BI - SSIS ( Basics I )

SSIS - Basic Concepts Tasks Bulk Insert Task—Loads data into a table by using the BULK INSERT SQL command. Data Flow Task—This is the most important task that loads and transforms data into an OLE DB Destination. Execute Package Task—Enables you to execute a package from within a package, making your SSIS packages modular. Execute Process Task—Executes a program external to your package, like one to split your extract file into many files before processing the individual files. Execute SQL Task—Executes a SQL statement or stored procedure. File System Task—This task can handle directory operations like creating, renaming, or deleting a directory. It can also manage file operations like moving, copying, or deleting files. FTP Task—Sends or receives files from an FTP site. Script Task—Runs a set of VB.NET or C# coding inside a Visual Studio environment. Send Mail Task—Sends a mail message through SMTP. Analysis Services Processing Task—This task processes a SQL Server A...
Publicar un comentario
Leer más

TOGAF9

Kinds of Architectures Business Architecture / Business Process Architecture    Define the business strategy, governance, organization and key business processes Data Architecture    Describe the structure of an organization logical and physical data assets and data resources Application Architecture    Describe a blueprint for the individual application systems to be deploy, interactions and  their relationships to the core business processes of the organization Technology Architecture    Describe the logical software and hardware capabilities that are required to support the deployment of business data and application services. This includes middle-ware infrastructure, networks, communications, processing standards  Architecture Governance Increase transparency of accountability, and informed delegation of authority Controlled risk management Protection of the existing asset base through maximizing  re-us...
Publicar un comentario
Leer más