i try to use AdalAngular in angularJS but it can inject the modul .do you have en idee to solve that i try to work with the AZUreAD :
var app = angular.module("myApp", [ 'ngRoute', 'AdalAngular' ]);
app.config(['$routeProvider', '$httpProvider', 'adalAuthenticationServiceProvider', function($routeProvider,
$httpProvider, adalProvider, $locationProvider) {
$routeProvider.when('/', {
controller : "loginController",
templateUrl : "login.html"
}
the file d'index : the load of the file work but u have this error ncaught Error: [$injector:modulerr]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Car parks</title>
<link href="/css/style.css" rel="stylesheet">
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link
href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"
rel="stylesheet">
</head>
<body ng-app="myApp">
<script src="modul/angularJS-1.2.32/angular.min.js"
type="text/javascript"></script>
<script src="modul/angularJS-1.2.32/angular-resource.min.js"
type="text/javascript"></script>
<script src="modul/angularJS-1.2.32/angular-route.min.js"
type="text/javascript"></script>
<script src="modul/angularJS-1.2.32/adal.min.js"></script>
<script src="modul/angularJS-1.2.32/adal-angular.min.js"></script>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/popper.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/myApp.js" type="text/javascript"></script>
<script src="js/controller/loginController.js" type="text/javascript"></script>
<script src="js/controller/UserController.js" type="text/javascript"></script>
<script src="js/controller/SecretaryController.js"
type="text/javascript"></script>
<script src="js/controller/AdminController.js" type="text/javascript"></script>
<script src="js/controller/SearchCarController.js"
type="text/javascript"></script>
<script src="js/controller/UserAddController.js" type="text/javascript"></script>
<script src="js/controller/AddCarController.js" type="text/javascript"></script>
<script src="js/controller/ProfilController.js" type="text/javascript"></script>
<script src="js/controller/ValidateController.js"
type="text/javascript"></script>
<script src="js/controller/LogoutController.js" type="text/javascript"></script>
<div ng-view></div>
</body>
</html>
You don't have $locationProvider
app.config(['$routeProvider', '$httpProvider', 'adalAuthenticationServiceProvider', '$locationProvider',
function ($routeProvider, $httpProvider, adalProvider, $locationProvider) {
$routeProvider.when('/', {
controller: "loginController", templateUrl: "login.html"
});
}]);
Related
Index.html it is the main html page
I am not able to load views in angularjs though ui-route and provider seems working fine ....here is the piece of code
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- build:css(client) app/vendor.css -->
<!-- bower:css -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:css({.tmp,client}) app/app.css -->
<link rel="stylesheet" type="stylesheet" href="app/app.css">
<!-- injector:css -->
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX-X');
ga('send', 'pageview');
</script>
</head>
<!--[if lt IE 9]>
<script src="bower_components/es5-shim/es5-shim.js"></script>
<script src="bower_components/json3/lib/json3.min.js"></script>
<![endif]-->
<!-- build:js({client,node_modules}) app/vendor.js -->
<!-- bower:js -->
<script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
<script type="text/javascript" src="bower_components/angular/angular.js"></script>
<script type="text/javascript" src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script type="text/javascript" src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script type="text/javascript" src="bower_components/angular-cookies/angular-cookies.js"></script>
<script type="text/javascript" src="bower_components/angular-cookies/angular-cookies.js"></script>
<script type="text/javascript" src="bower_components/angular-resource/angular-resource.js"></script>
<script type="text/javascript" src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script type="text/javascript" src="bower_components/angular-socket-io/socket.js"></script>
<script type="text/javascript" src="bower_components/braintree-angular/dist/braintree-angular.js"></script>
<script type="text/javascript" src="bower_components/lodash/dist/lodash.compat.js"></script>
<script type="text/javascript" src="bower_components/ng-file-upload/ng-file-upload.js"></script>
<script type="text/javascript" src="bower_components/ng-file-upload-shim/ng-file-upload-shim.js"></script>
<script type="text/javascript" src="bower_components/ngCart/dist/ngCart.js"></script>
<!-- endbower -->
<script type="javascript" src="socket.io-socket.io.js"></script>
<!-- endbuild -->
<!-- build:js(.tmp) app/app.js -->
<!-- injector:js -->
<script type="text/javascript" src="app/app.js"></script>
<script type="text/javascript" src="app/account/account.js"></script>
<script type="text/javascript" src="app/account/login/login.controller.js"></script>
<script type="text/javascript" src="app/account/settings/settings.controller.js"></script>
<script type="text/javascript" src="app/account/signup/signup.controller.js"></script>
<script type="text/javascript" src="app/admin/admin.controller.js"></script>
<script type="text/javascript" src="app/admin/admin.js"></script>
<script type="text/javascript" src="app/main/main.controller.js"></script>
<script type="text/javascript" src="app/main/main.js"></script>
<script type="text/javascript" src="app/products/products.controller.js"></script>
<script type="text/javascript" src="app/products/products.js"></script>
<script type="text/javascript" src="app/products/products.service.js"></script>
<script type="text/javascript" src="components/auth/auth.service.js"></script>
<script type="text/javascript" src="components/auth/user.service.js"></script>
<script type="text/javascript" src="components/footer/footer.directive.js"></script>
<script type="text/javascript" src="components/modal/modal.service.js"></script>
<script type="text/javascript" src="components/mongoose-error/mongoose-error.directive.js"></script>
<script type="text/javascript" src="components/navbar/navbar.controller.js"></script>
<script type="text/javascript" src="components/navbar/navbar.directive.js"></script>
<script type="text/javascript" src="components/sidebar/sidebar.controller.js"></script>
<script type="text/javascript" src="components/sidebar/sidebar.service.js"></script>
<script type="text/javascript" src="components/socket/socket.service.js"></script>
<!-- endinjector -->
<!-- endbuild -->
<!-- endinjector -->
<!-- endbuild -->
<body ng-app="meanshopApp">
<!--[if lt IE 7]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please upgrade your browser to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<div ui-view></div>
</body>
</html>
I an not able to load views in angularjs though ui-route and provider seems working fine ....here is the piece of code
app.js
var app=angular.module('meanshopApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'btford.socket-io',
'ui.router',
'ui.bootstrap',
'ngFileUpload',
'ngCart',
'braintree-angular'
])
app.config(["$stateProvider", "$urlRouterProvider","$locationProvid","$httpProvider",
function ($stateProvider, $urlRouterProvider,$locationProvider, $httpProvider) {
$urlRouterProvider.otherwise("/");
$stateProvider
.state('/', {
url: "",
templateUrl: 'app/main/main.html',
controller :'MainCtrl'
})
$locationProvider.html5Mode(true);
$httpProvider.interceptors.push('authInterceptor');
}]);
app.factory('authInterceptor', function($rootScope, $q, $cookies, $injector) {
var state;
return {
// Add authorization token to headers
request: function(config) {
config.headers = config.headers || {};
if ($cookies.get('token')) {
config.headers.Authorization = 'Bearer ' + $cookies.get('token');
}
return config;
},
// Intercept 401s and redirect you to login
responseError: function(response) {
if (response.status === 401) {
(state || (state = $injector.get('$state'))).go('login');
// remove any stale tokens
$cookies.remove('token');
return $q.reject(response);
}
else {
return $q.reject(response);
}
}
};
})
app.run(function($rootScope, $state, Auth) {
// Redirect to login if route requires auth and the user is not logged in
// also if the user role doesn't match with the one in `next.authenticate`
$rootScope.$on('$stateChangeStart', function(event, next) {
if (next.authenticate) {
var loggedIn = Auth.isLoggedIn(function(role) {
if (role && role === next.authenticate) {
return; // logged in and roles matches
}
event.preventDefault();
if(role) {
// logged in but not have the privileges (roles mismatch)
$state.go('onlyAdmin');
} else {
// not logged in
$state.go('login');
}
});
}
});
})
I am not able to load views in angularjs though ui-route and provider seems working fine ....here is the piece of code
main.html
<navbar></navbar>
<header class="hero-unit" id="banner">
<div class="container">
<h1>MEANshop</h1>
<p class="lead">The MEAN stack one stop shop</p>
<img src="assets/images/logo.png" alt="the meanstack shop">
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Featured Products:</h1>
<ul class="nav nav-tabs nav-stacked col-md-4 col-lg-4 col-sm-6" ng-repeat="product in products">
<li><a ui-sref="viewProduct({id: product._id})" tooltip="{{product.description}}">
{{product.title}} -
<span class="text-muted">{{product.price | currency}}</span>
</a></li>
</ul>
</div>
</div>
</div>
<footer></footer>
I an not able to load views in angularjs though ui-route and provider seems working fine ....here is the piece of code
maincontroller
'use strict';
angular.module('meanshopApp')
.controller('MainCtrl', function($state,$scope,$http, socket, Product) {
alert("helloeen");
$scope.products = Product.query();
});
After going through your code, i came across some issues which is basically restricting the main.html to load. Kindly fix below issues in you app.js file
$locationProvider spelling is incorrect
url while defining state should not be blank.
Do you need to enable htmlMode5 because i have faced lot of issues while enabling this.You can use $locationProvider.hashPrefix('') to make URL better;
app.config(["$stateProvider",
"$urlRouterProvider","$locationProvider","$httpProvider",
function ($stateProvider, $urlRouterProvider,$locationProvider, $httpProvider) {
$urlRouterProvider.otherwise("/");
$stateProvider
.state('/', {
url: "/",
templateUrl: 'app/main/main.html',
controller :'MainCtrl'
})
$locationProvider.hashPrefix('');
$httpProvider.interceptors.push('authInterceptor');
}]);
Hi I've been having some problems refactoring my controllers into their own snippets
I want the controllers to inherit the dependencies from my initial app declaration.
"use strict";
angular.module('clockOn', ['angular-contextual-date','logon','milli','mobile','ClockOnController','Auth','ngStorage'])
I need these dependencies to flow through my controllers.
angular.module('clockOn').controller('LogonController', ['$rootScope','$scope','$location','$localStorage','Auth',
function($rootScope, $scope, $location, $localStorage,Auth){
creates unknown provider errors --I'm assuming the dependencies aren't flowing down--
angular.module('clockOn',[]).controller()
creates undefined function 'controllerName' errors -In this scenario I'm assuming I'm redefining the app and hence loosing the other controllers-
Here's two of the controllers
(function (){
angular.module('clockOn',['Auth','angular-contextual-date'])
.controller('ClockOnController', ['$http','Auth','contextualDateService' ,function ($http,Auth,contextualDateService){
this.user = Auth.getTokenClaims().user; //authorised is a property of the controller
contextualDateService.config.fullDateFormats.thisMonth = "MMM d 'at' h:mm a ";
this.shifts = getShifts(this);
function getShifts(clockOnCtrl){
var date = new Date();
var curr_date = Date.now();
var week_from_now = Date.now()+"7";
$http({
method: 'GET',
url: '/shifts',
params: {"user_id":clockOnCtrl.user._id,
"start_at":curr_date,
"finish_at":week_from_now}
}).
then(function(res){
if (typeof res !== 'undefined'){
console.log(res.data);
clockOnCtrl.shifts = res.data;
}},
function(error){
console.log(error)
});
}
}]);
})();
My index file
<!DOCTYPE html>
<html class="container" ng-app="clockOn"> <!-- ng-app tells the html page which app/module it belongs too runs the store module on load-->
<head>
<meta name="viewport" content="width=device-width , initial-scale=1">
<link rel="stylesheet" type="text/css" href="../resources/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="../resources/custom.css"/>
</head>
<body>
<script type="text/javascript" src="../resources/jquery.min.js"></script>
<script type="text/javascript" src="../resources/angular.min.js"></script>
<script type="text/javascript" src="../resources/bower_components/angular-contextual-date/dist/angular-contextual-date.js"></script>
<script type="text/javascript" src="../modules/app.js"></script>
<script type="text/javascript" src="../modules/logon.js"></script>
<script type="text/javascript" src="../modules/tasks.js"></script>
<script type="text/javascript" src="../services/milli.js"></script>
<script type="text/javascript" src="../services/auth.js"></script>
<script type="text/javascript" src="../modules/mobile.js"></script>
<script type="text/javascript" src="../modules/shifts.js"></script>
<script type="text/javascript" src="../modules/layout-components.js"></script>
<script type="text/javascript" src="../resources/bower_components/ngstorage/ngStorage.min.js"></script>
<script type="text/javascript" src="../controllers/controller-clockOn.js"></script>
<script type="text/javascript" src="../controllers/controller-logon.js"></script>
<script type="text/javascript" src="../controllers/controller-tasks.js"></script>
<div class="container" ng-controller="ClockOnController as clockOnCtrl">
<div class= "" ng-controller="LogonController as logonCtrl">
<logon-form></logon-form>
<top-menu></top-menu>
<div class="page-header" ng-show="token">
<h2 class="">Welcome {{clockOnCtrl.user.name | uppercase}}
<small>You currently have {{clockOnCtrl.shifts.length}} shifts</small>
<h2>
</div>
<shifts-list></shifts-list>
<custom-footer></custom-footer>
</div>
</div>
</body>
</html>
The error Argument 'ClockOnController' is not a function, got undefined
I am trying to learn AngularJS. I have a navigation setup as a view and I cannot get it to display. When I look in the inspector i see <!-- ngInclude: views/nav.html -->.
index.html
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>The ToDo List</title>
<script type="text/javascript" src="assets/js/lib/angular.min.js"></script>
<script type="text/javascript" src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script>
<script type="text/javascript" src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script>
<script type="text/javascript" src="assets/js/lib/angular-route.min.js"></script>
<script type="text/javascript" src="assets/js/lib/angular-animate.min.js"></script>
<script type="text/javascript" src="assets/js/app.js"></script>
<script type="text/javascript" src="assets/js/controllers/activetaskscontoller.js"></script>
</head>
<body>
<div class="navigation" ng-include="views/nav.html"></div>
Here is my app.js
var myApp = angular.module('myApp',
['ngRoute', 'firebase', 'appControllers']);
var appControllers = angular.module('appControllers', ['firebase']);
myApp.config(['$routeProvider',function($routeProvider) {
$routeProvider.
when('/active-tasks', {
templareUrl: 'views/active-tasks.html',
controller: 'ActiveTasksController',
}).
when('/completed-tasks', {
templareUrl: 'views/completed-tasks.html',
controller: 'CompletedTasksController',
}).
otherwise({
redirectTo: '/active-tasks'
});
}]);
ng-include is expecting a string and not a path.
Try changing to this:
<div class="navigation" ng-include="'views/nav.html'"></div>
You can read more about the subject here: AngularJS ng-include does not include view unless passed in $scope
I am having trouble with ngRoute. Everything looks to be spelled correctly, and I believe my syntax is correct. Pages are not routing and I am getting the injector:modulerr error.
Index.html:
<body ng-app='creativeBillingApp' >
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/json3/lib/json3.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-touch/angular-touch.js"></script>
**<script src="bower_components/angular-route/angular-route.js"></script>**
<script src="bower_components/plugins/jquery.slimscroll.min.js"></script>
<script src="bower_components/plugins/jquery.easing.min.js"></script>
<script src="bower_components/plugins/appear/jquery.appear.js"></script>
<script src="bower_components/plugins/jquery.placeholder.js"></script>
<script src="bower_components/plugins/fastclick.js"></script>
routes.js
use strict';
var app = angular.module('creativeBillingApp', ['ngRoute']);
app.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.when('/carriers', {
templateUrl: 'views/carriers.html',
controller: 'MainCtrl'
})
.otherwise({redirectTo: '/'});
}])
app.js
'use strict';
angular.module('creativeBillingApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
]);
complete index.html:
<!DOCTYPE HTML>
<html ng-app='creativeBillingApp' class="no-js">
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- build:css(.) styles/vendor.css -->
<!-- bower:css -->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
<!-- endbower -->
<!-- endbuild -->
<!-- build:css(.tmp) styles/main.css -->
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="bower_components/www/css/font-awesome.css">
<link rel="stylesheet" href="bower_components/www/css/themify-icons.css"/>
<link rel="stylesheet" href="bower_components/www/css/animate.min.css"/>
<link rel="stylesheet" href="bower_components/www/css/skins/palette.css"/>
<link rel="stylesheet" href="bower_components/www/css/fonts/font.css"/>
<link rel="stylesheet" href="bower_components/www/css/main.css"/>
<script src="bower_components/www/plugins/modernizr.js"></script>
<!-- endbuild -->
</head>
<body>
<!-- main content -->
<div class="mainContainer" ng-view></div>
<!-- /main content -->
</section>
</div>
</script>
<!-- build:js(.) scripts/oldieshim.js -->
<!--[if lt IE 9]>
<script src="bower_components/es5-shim/es5-shim.js"></script>
<script src="bower_components/json3/lib/json3.min.js"></script>
<![endif]-->
<!-- endbuild -->
<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/json3/lib/json3.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-touch/angular-touch.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/plugins/jquery.slimscroll.min.js"></script>
<script src="bower_components/plugins/jquery.easing.min.js"></script>
<script src="bower_components/plugins/appear/jquery.appear.js"></script>
<script src="bower_components/plugins/jquery.placeholder.js"></script>
<script src="bower_components/plugins/fastclick.js"></script>
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/routes.js"></script>
<script src="scripts/offscreen.js"></script>
<script src="scripts/main.js"></script>
<script src="scripts/controllers/main.js"></script>
<script src="scripts/filters/reverse.js"></script>
<script src="scripts/controllers/account.js"></script>
<script src="scripts/controllers/user.js"></script>
<!-- endbuild -->
</body>
</html>
This is the error I am getting:
GET http://localhost:9000/bower_components/www/css/main.css.map 404 (Not Found) (index):220
Uncaught Error: [$injector:modulerr] Failed to instantiate module creativeBillingApp due to:
TypeError: undefined is not a function
at http://localhost:9000/scripts/routes.js:30:8
at Object.invoke (http://localhost:9000/bower_components/angular/angular.js:3869:17)
at http://localhost:9000/bower_components/angular/angular.js:3788:37
at Array.forEach (native)
at forEach (http://localhost:9000/bower_components/angular/angular.js:323:11)
at loadModules (http://localhost:9000/bower_components/angular/angular.js:3775:5)
at createInjector (http://localhost:9000/bower_components/angular/angular.js:3715:11)
at doBootstrap (http://localhost:9000/bower_components/angular/angular.js:1379:20)
at bootstrap (http://localhost:9000/bower_components/angular/angular.js:1394:12)
at angularInit (http://localhost:9000/bower_components/angular/angular.js:1307:5)
http://errors.angularjs.org/1.2.16/$injector/modulerr?p0=creativeBillingApp…2F%2Flocalhost%3A9000%2Fbower_components%2Fangular%2Fangular.js%3A1307%3A5) angular.js:78
Your app name creativeBillingApp should be registered one time.
Remove the following line from routes.php and check
var app = angular.module('creativeBillingApp', ['ngRoute']);
Since, app is a global variable and you can use it directly in routes.js
Note: routes.js should call after app.js
Working demo: http://plnkr.co/edit/dZ9AY0qIXD7YJD1UAt3C?p=preview
I am just starting study Angular and trying example from book, but my simple routing doesn't work.
I have updated code as was recommended in the answers
Here is index.html:
<html ng-app="airline">
<head>
<title>Demo</title>
<script type="text/javascript" src="js/lib/angular.min.js"></script>
<script type="text/javascript" src="js/lib/angular-route.min.js"></script>
<script type="text/javascript" src="js/lib/angular-resource.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/controllers/app.js"></script>
</head>
<body>
<div class="container" ng-controller="AppCtrl">
<h1>AngulAir</h1>
<div ng-view></div>
</div>
</body>
</html>
Here is app.js:
angular.module('airline', ['ngRoute'])
.config(airlineRouter);
function airlineRouter ($routeProvider) {
info('1');
$routeProvider
.when('/', {template: '<h3>test</h3>'})
};
When I refresh the page I don't have 'test' in the browser and don't have alert message. Why ? What I am missing ?
Update
Here is a full code example: https://github.com/demas/ang_test
Latest angular library use external router so you need to inject ngRoute and pass it as:
angular.module('airline', ['ngRoute'])
You are missing ngRoute directive. Download ng-route.js file and reference it in your HTML like;
<script type="text/javascript" src="js/lib/angular-route.js"></script>
And change your app.js like
angular.module('airline', ['ngRoute'])
.config(airlineRouter);
function airlineRouter ($routeProvider) {
info('1');
$routeProvider
.when('/', {template: '<h3>test</h3>'})
};