ngRoute is not working in AngularJS

ngRoute is not working in AngularJS - javascript

I am trying to use Route in my newEvent page. But it's giving me 404 error. I checked my code but I am not able to identify the error.
can anyone please check my codes and let me know whats wrong im doing here. I uploaded app.js , EditEventController.js , index.html and NewEvent.html file. I also uploaded a screenshot. Please take a look and let me solve this error.
Thank you
'use strict';
var eventsApp = angular.module('eventsApp', ['ngResource', 'ngRoute'])
.config(function ($routeProvider) {
$routeProvider.when('/newEvent', {
templateUrl: 'templates/NewEvent.html',
controller: 'EditEventController'
});
});
.factory('myCache', function ($cacheFactory) {
return $cacheFactory('myCache', {
capacity: 3
});
});
........................
'use strict';
eventsApp.controller('EditEventController',
function EditEventController($scope, eventData) {
$scope.saveEvent = function (event, newEventForm) {
if (newEventForm.$valid) {
eventData.save(event)
.$promise
.then(
function (response) {
console.log('success', response)
})
.catch(
function (response) {
console.log('failure', response)
}
);
}
};
$scope.cancelEdit = function () {
window.location = "/EventDetails.html";
};
}
);
........................
<!DOCTYPE html>
<html lang="en" ng-app="eventsApp">
<head>
<meta charset="utf-8">
<title>Event Registration</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/app.css">
<script src="lib/jquery.min.js"></script>
<script src="lib/underscore-1.4.4.min.js"></script>
<script src="lib/bootstrap.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-sanitize.js"></script>
<script src="lib/angular/angular-resource.min.js"></script>
<script src="angular/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers/EventController.js"></script>
<script src="js/controllers/EditEventController.js"></script>
<script src="js/services/EventData.js"></script>
<script src="js/filters.js"></script>
</head>
<body>
<div class="container">
<div class="navbar">
<div class="navbar-inner">
<ul class="nav">
<li> Create Event </li>
</ul>
</div>
</div>
<ng-view> </ng-view>
</div>
</body>
</html>
...................................
<div style="padding-left:20px; padding-right:20px">
<div class="container">
<h1> New Event</h1>
<hr />
<form name="newEventForm">
<fieldset>
<label for="eventName">Event Name: </label>
<input id="eventName" type="text" required ng-model='event.name' placeholder="Name of your event...." />
<label for="eventDate">Event Date: </label>
<input id="eventDate" type="text" required ng-pattern="/\d\d/\d\d/\d\d\d\d/" ng-model='event.date' placeholder="format (mm/dd/yyyy)...." />
<label for="eventTime">Event Time: </label>
<input id="eventTime" type="text" ng-model='event.time' placeholder="Start and end time...." />
<label for="eventLocation">Event Location: </label>
<input id="eventLocation" type="text" ng-model='event.location.address' placeholder="Address of event...." />
<br>
<input id="eventCity" type="text" ng-model='event.location.city' class="input-small" placeholder="City ...." />
<input id="eventProvince" type="text" ng-model='event.location.province' class="input-small" placeholder="Province ...." />
<label for="eventImageUrl">Image</label>
<input id="eventImageUrl" type="url" ng-model='event.imageUrl' class="input-xlarge" placeholder="Url of image ...." />
</fieldset>
<img ng-src="{{event.imageUrl}}" src="" />
<br>
<br>
<button type="submit" ng-disabled="newEventForm.$invalid" ng-click="saveEvent(event, newEventForm)" class="btn btn-primary">Save</button>
<button type="submit" ng-click="cancelEdit()" class="btn btn-primary">Cancel</button>
</form>
</div>
</div>

In your html, should this entry:
<script src="angular/angular-route.js"></script>
... be changed to this, so that it matches the location to the other angular files?
<script src="lib/angular/angular-route.js"></script>

Related

Problems on the generated value of the qr code into a input field using JavaScript

JavaScript codes and HTML codes
I'm trying to put a generated value of the qr code a input text to be save in my SQLite database can't pust the darn value of the qr code
var resultDiv;
document.addEventListener("deviceready", init, false);
function init() {
document.querySelector("#startScan").
addEventListener("touchend", startScan, false);
resultDiv = document.querySelector("#results");//works in <p id="results"></p>
resultDiv = document.querySelector('#text4');//wont work at all <input id="text4" type="text" placeholder="Book Info"/>
}
function startScan() {
cordova.plugins.barcodeScanner.scan(
function (result) {
var s = result.text.split('|');
result.format;
result.cancelled;
resultDiv.innerHTML = s;
},
function (error) {
alert("Scanning failed: " + error);
}
);
}
JavaScript codes and HTML codes
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>qrBorrowers</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<script type="text/javascript" src="cordova.js"></script>
<nav>
<div class="topnav">
Add
Borrow
Return
QR code
</div>
</nav>
<Label>
<h1> Borrow a Book </h1>
</Label>
<div class="borrow">
<input id="text1" type="text" placeholder="Borrower Number" onfocus="this.value=''"/>
<input id="text2" type="text" placeholder="Borrower Last Name" onfocus="this.value=''" />
<input id="text3" type="text" placeholder="Borrower First Name" onfocus="this.value=''" />
<input id="text4" type="text" placeholder="Book Info"/>
<input id="text6" type="date" placeholder="Date Borrowed" />
<br>
</div>
<div class="borrow">
<p id="results"></p>
<button id="startScan">Start Scan</button>
<button id="savedb">Save </button>
</div>
<script type="text/javascript" src="js/scanQR.js"></script>
</body>
</html>

With inner HTML it will not going to save your generated QR code to input box. You need to change the innerHTML to value to save the value in input box such that you can use that when form submit as value to save in database.
var resultDiv;
document.addEventListener("deviceready", init, false);
function init() {
document.querySelector("#startScan").
addEventListener("touchend", startScan, false);
resultDiv = document.querySelector("#results");//works in <p id="results"></p>
resultDiv = document.querySelector('#text4');//wont work at all <input id="text4" type="text" placeholder="Book Info"/>
}
function startScan() {
cordova.plugins.barcodeScanner.scan(
function (result) {
var s = result.text.split('|');
result.format;
result.cancelled;
resultDiv.value = s;
},
function (error) {
alert("Scanning failed: " + error);
}
);
}
JavaScript codes and HTML codes
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>qrBorrowers</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<script type="text/javascript" src="cordova.js"></script>
<nav>
<div class="topnav">
Add
Borrow
Return
QR code
</div>
</nav>
<Label>
<h1> Borrow a Book </h1>
</Label>
<div class="borrow">
<input id="text1" type="text" placeholder="Borrower Number" onfocus="this.value=''"/>
<input id="text2" type="text" placeholder="Borrower Last Name" onfocus="this.value=''" />
<input id="text3" type="text" placeholder="Borrower First Name" onfocus="this.value=''" />
<input id="text4" type="text" placeholder="Book Info"/>
<input id="text6" type="date" placeholder="Date Borrowed" />
<br>
</div>
<div class="borrow">
<p id="results"></p>
<button id="startScan">Start Scan</button>
<button id="savedb">Save </button>
</div>
<script type="text/javascript" src="js/scanQR.js"></script>
</body>
</html>

To save the value in input box should not use "resultDiv.innerHTML = s;"
Rather you should use "resultDiv.value = s" which will save your code to input box which you can use to save in SQLite Database.

Angularjs ngRoute is not working

i have an index page(login ) in which register link is present so while redirecting i am trying to load the controller but it is not loading also there is no error in console.
My home page is getting loaded with URL : http://localhost:8081/WebServices/
and after clicking resgiter i am trying to rediect it to : http://localhost:8081/WebServices/#/regsiter
Help would be appreciated.
My index.html page
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Login Page</title>
<script type="text/javascript" src= "/WebServices/js/angular.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/angular-resource.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/angular-route.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/friendsCtrl.js"></script>
<script type="text/javascript" src= "/WebServices/js/friendsService.js"></script>
<script type="text/javascript" src= "/WebServices/js/loginCtrl.js"></script>
<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css">
</head>
<body>
<div ng-app="loginApp">
<div class="col-md-3">
<h2>Login</h2>
<form name="loginform" role="loginform" ng-submit="login()">
<div class="form-group" ng-class="{ 'has-error':loginform.username.$dirty && loginform.username.$error.required }" >
<label for="username">Username</label>
<input type="text" name="username" class="form-control" ng-model="user.username" required />
<span ng-show="loginform.username.$dirty && loginform.username.$error.required " class="help-block">Username is required</span>
</div>
<div class="form-group" ng-class="{ 'has-error':loginform.username.$dirty && loginform.username.$error.required }">
<label for="Password">Password</label>
<input type="password" name="password" class="form-control" ng-model="user.password" required />
<span ng-show="loginform.password.$dirty && loginform.password.$error.required " class="help-block">Password is required</span>
</div>
<div class="form-actions">
<button type ="submit" class="btn btn-primary" ng-disabled="loginform.$invalid">Login</button>
Resgiter
</div>
</form>
</div>
</div>
</body>
</html>
loginCtrl.js file
var loginApp=angular.module('loginApp',['ngRoute']);
loginApp.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/' , {
templateUrl:'index.html',
controller: 'loginCtrl'
})
.when('/regsiter' , {
templateUrl:'registration_ang.html',
controller: 'loginCtrl'
})
.otherwise({
redirectTo:'/'
});
}]);
loginApp.controller('loginCtrl',['$scope',function($scope){
console.log("controller loaded");
alert("controller loaded");
$scope.login=function(){
console.log("inside loginCtrl : login function");
alert("checking login.");
};
}
]
);

You have missed to add ng-view directive on your page, so that will load the template & controller configured on $routeProvider inside ng-view directive element.
<div ng-view></div>

Creating a Search on AngulaJs: Uncaught Error: [$injector:modulerr]

I am trying to create a search on AngularJs based on the snippet I found on codepen and this is the URL http://codepen.io/netsi1964/pen/AmGcg
This is a snippet on what I have tried
<div ng-app="myApp" ng-controller="Example">
<div class="container controls">
<div class="row">
<div class="col-md-12">
<form action="" method="POST" role="form">
<legend>Find a movie from YouBio</legend>
<div class="input-group">
<input type="search" id="search" class="form-control" ng-model="search">
<div class="input-group-addon">Found {{(movies | filter:search).length}} of {{movies.length}}</div>
<div class="input-group-addon "><input type="checkbox" ng-model="reverse" value="true" id="reverse" /><label for="reverse">Reverse</label></div>
<div class="input-group-addon "><input type="checkbox" ng-model="list" value="true" id="reverse" /><label for="list">List</label></div>
</div>
</form>
</div>
</div>
</div>
This is JS file:
angular.module("myApp",["ngSanitize"])
.filter('replace', function () {
var pat = / /gi;
return function (text) {
var clean = text.replace(pat, "-");
var temp = clean.split("---");
if (temp.length>1) {
clean = temp[0];
}
return clean;
};
})
.controller("Example", function($scope, $interval) {
$scope.search = "orig";
$scope.movies = youMovie;
$scope.reverse = false;
$scope.list = false;
});
And I am getting the following the error
Uncaught Error: [$injector:modulerr]
On my Chrome Console
And here is a plunk I have made
http://plnkr.co/edit/00ghGQtBKkvEKkzlD52c?p=preview

I made some modifications and the code is working now.
HMTL markup, by the way there were lots of miskes.
<html>
<head>
<title></title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.1.0/css/ionic.min.css" rel="stylesheet">
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.1.0/js/ionic.bundle.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular-sanitize.min.js"></script>
<script src="app.js"></script>
<link href="style.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<h1 class="col-md-12">AngularJS <code>ng-repeat</code> with search</h1>
<blockquote>AngularJS lets you easily do a <em>instant search</em> if you say save your data as <code>JSON</code>. The elegant way that it is coded and the performance I find great. The <code>JSON</code> data I use, I have collected from Danish streaming TV service YouBio. I use <code>bootstrap 3</code> to control the markup/layout. <br />
<code>2014/11/14</code> Added link to watch the movie on YouSee Play (not free).</blockquote>
</div>
</div>
<div ng-app="myApp" ng-controller="Example">
<div class="container controls">
<div class="row">
<div class="col-md-12">
<form action="" method="POST" role="form">
<legend>Find a movie from YouBio</legend>
<div class="input-group">
<input type="search" id="search" class="form-control" ng-model="search">
<div class="input-group-addon">Found {{(movies | filter:search).length}} of {{movies.length}}</div>
<div class="input-group-addon "><input type="checkbox" ng-model="reverse" value="true" id="reverse" /><label for="reverse">Reverse</label></div>
<div class="input-group-addon "><input type="checkbox" ng-model="list" value="true" id="reverse" /><label for="list">List</label></div>
</div>
</form>
</div>
</div>
</div>
<div class="container result">
<div ng-class="list ? 'col-md-6' : 'col-md-4'" class="movie" ng-repeat="movie in movies | filter:search | orderBy:'title':reverse"> <a href="https://film.youseeplay.dk/search/{{movie.title}}" target="_blank">
<img ng-class="list ? 'col-md-2' : 'col-md-12'" ng-src="{{movie.src}}" alt="Click to play {{movie.title}} on YouSee Play (not free)" title="Click to play {{movie.title}} on YouSee Play (not free)" class="img-thumbnail" /></a>
<h4 ng-class="list ? 'col-md-10' : 'col-md-12'">{{movie.title}}</h4>
</div>
</div>
</div>
<body>
</html>
Controller, also you did't have and data to present in the view so I added some dummy data:
angular.module("myApp",["ngSanitize"])
.filter('replace', function () {
var pat = / /gi;
return function (text) {
var clean = text.replace(pat, "-");
var temp = clean.split("---");
if (temp.length>1) {
clean = temp[0];
}
return clean;
};
})
.controller('Example', ['$scope',
function($scope) {
$scope.$watch('search', function(newVal, oldVal) {
$scope.search = newVal;
$scope.movies = [{title: 'Movie 1'}, {title: 'Movie 2'}, {title: 'Movie 3'}, {title: 'Moive 4'}, {title: 'Movie 5'}];
$scope.reverse = false;
$scope.list = false;
});
}
]);
//document.querySelector('#search').focus();

You are injecting a module you have not loaded on the page. The ngSantize module is standalone from the angular.min.js source. You need to load angular-sanitize.min.js on the page.

you not load santize file like:
Index.html
<html>
<head>
<title></title>
</head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.1.0/css/ionic.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.min.js"></script>
//** This file add***
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-sanitize.js"></script>
<script src="app.js"></script>
<link href="style.css" rel="stylesheet">
<body>

Scripts don't load: Using AngularJS with JSON (Firebase)

I've tried to build an application that let's you input data into several fields, uses AngularJS to put data into a Firebase JSON, and outputs that data into nicely laid out "cards".
Initially I could input and output data, but as soon as I hooked it up to AngularJS and Firebase I just got '{{ 1 + 2 }}' instead of '3' in my browser.
I'm running this code on my webserver, I hope you can help me figure out what the problem is – the page is pretty much blank. Everything that depends on Angular isn't showing up.
Link to live page:
repertoire.me/anustart
Here's my code:
index.html
<html lang="en" ng-app="repertoire">
<head>
<meta charset="utf-8">
<title>Repertoire Beta</title>
<!-- STYLES -->
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css" />
<!-- SCRIPTS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
<script type="text/javascript" src="assets/js/angular.js"></script>
<script type="text/javascript" src="assets/js/angular.min.js"></script>
<script type="text/javascript" src="assets/js/app.js"></script>
<script type="text/javascript" src="assets/js/venues.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body ng-controller="VenueController as venueCtrl">
<p class="ANGULAR_TEST">1 + 2 = {{ 1 + 2 }}</p>
<header class="card">
<h1>repertoire</h1>
</header>
<venue-list></venue-list>
<venue-form></venue-form>
<footer id="info" class="card" ng-include="'footer.html'"></footer>
</body>
</html>
venue-list.html
<section class="card" id="venueList">
<h2 class="venue_name">{{venueCtrl.venue.name}}</h2>
<h3 class="venue_location">{{venueCtrl.venue.location}}</h3>
<div class="pricecat">
<span class="venue_price">{{venueCtrl.venue.price}}</span>
<span class="venue_category">{{venueCtrl.venue.species}} {{venueCtrl.venue.genre}}</span>
</div>
<p class="venue_description">{{venueCtrl.venue.description}}</p>
<p class="venue_tags">{{venueCtrl.venue.tags}}</p>
</section>
venue-form.html
<section class="card" id="venueForm">
<form name="venueForm" ng-controller="VenueController as venueCtrl" ng-submit="venueForm.$valid && venueCtrl.venueForm(info)" novalidate>
<input ng-model="venueCtrl.venue.name" type='text' class="input" id='nameInput' placeholder='Venue Name' required/>
<input ng-model="venueCtrl.venue.location" type='text' class="input" id='locationInput' placeholder='Address' required/>
<select ng-model="venueCtrl.venue.price" type='text' class="input" id='priceInput' ng-options="price for price in [$,$$,$$$,$$$$]">
<option value="">Price</option>
</select>
<input ng-model="venueCtrl.venue.genre" type='text' class="input" id='genreInput' placeholder='Category'/>
<input ng-model="venueCtrl.venue.species" type='text' class="input" id='speciesInput' placeholder='What kind?'/>
<textarea ng-model="venueCtrl.venue.description" type='text' class="input" id='descriptionInput' placeholder='Description'></textarea>
<input ng-model="venueCtrl.venue.tags" type='text' class="input" id='tagsInput' placeholder='Who did you go with?'/>
<label>Have you already been?</label>
<input ng-model="venueCtrl.venue.check" type="checkbox" checked />
<div> venueForm is {{venueForm.$valid}} </div>
<input type="submit" value="Add Venue"/>
</form>
</section>
app.js
(function() {
var app = angular.module('repertoire', ['repertoire-venues']);
//var app = new Firebase('https://xyz.firebaseio.com/');
app.controller("VenueController", ['$http', function($http){
var venue = this;
venue.info = [ ];
$http.get('venues.json').success(function(data){
venue.info = data;
});
}]);
})();
repertoire-venues.js
(function() {
var app = angular.module('repertoire-venues', []);
app.directive('venueList', function(){
return {
restrict: 'E',
templateUrl: 'venue-list.html'
};
});
app.directive('venueForm', function(){
return {
restrict: 'E',
templateUrl: 'venue-form.html'
controller: function(){
this.venue = {};
this.venueForm = function(info){
info.venues.push(this.venue);
this.venue = {};
};
},
controllerAs: 'venueCtrl'
};
});
})();
Thank you so much <3

you have included venues.js instead of repertoire-venues.js in the index page and there is a comma missing on line 14 in repertoire-venues.js

Angular controller not working

I'm newbie to angular
My angular controller is:
var chatApp = angular.module('chatApp.controllers', []);
chatApp.controller('loginController', ['$scope', function($scope) {
$scope.user_name="name";
$scope.user_password="name";
}]);
the app.js is:
'use strict';
angular.module('chatApp', [
'ui.router',
'chatApp.filters',
'chatApp.services',
'chatApp.directives',
'chatApp.controllers'
]).config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('login', {
url: "/login",
templateUrl: "partials/login.html",
controller : "loginController"
})
});
login.html is:
<div>
<div id="wrapper">
<form name="login-form" class="login-form" action="" method="post">
<div class="header">
<h1>Login Form</h1>
</div>
<div class="content">
<input name="username" type="text" class="input username" placeholder="{{user_name}}" />
<div class="user-icon"></div>
<input name="password" type="password" class="input password" placeholder="{{user_password}}" />
<div class="pass-icon"></div>
</div>
</form>
</div>
I've used stateprovider for routing.
But, it's not showing anything in placeholder. What is the reason?

Solved the problem using ng-model instead of {{}}.
<div class="content">
<input name="username" type="text" class="input username" placeholder="username" ng-model="user_name" />
<div class="user-icon"></div>
<input name="password" type="password" class="input password" placeholder="password" ng-model="user_password"/>
<div class="pass-icon"></div>
</div>

This works for me if I say ng-controller = "loginController" in the html-
<div ng-controller = 'loginController'>
<div id="wrapper">
<form name="login-form" class="login-form" action="" method="post">
<div class="header">
<h1>Login Form</h1>
</div>
<div class="content">
<input name="username" type="text" class="input username" placeholder="{{user_name}}" />
<div class="user-icon"></div>
<input name="password" type="password" class="input password" placeholder="{{user_password}}" />
<div class="pass-icon"></div>
</div>
</div>
Here's a JSBin with it working: http://jsbin.com/aDuJIku/265/edit?html,js,output
This solution doesn't include ui-router, but it should work with it.

Try this:
var chatApp = angular.module('chatApp.controllers', []);
chatApp.controller('loginController', ['$scope','$timeout', function($scope,$timeout) {
$timeout(function(){
$scope.user_name="name";
$scope.user_password="name";
},100);
}]);

you just have to change to RouteProvider, In your case you just do:
angular.module('chatApp', [ 'ngRoute' 'ui.router','chatApp.filters','chatApp.services', 'chatApp.directives', 'chatApp.controllers'])
.config(function($routeProvider) {
$routeProvider.when('/login', { templateUrl: "partials/login.html", controller: "loginController" })
});
please make sure that you have angular-route js included.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular-route.js"></script>
Hope this help you! ;)
Here's some examples for you this

Below mentioned code works.
Note: If somebody tries to run this code in preview its not going to work. JS and HTML code needs to be copied in separate file and use the names mentioned.
var myContrlApp = angular.module('ContrlApp', []);
myContrlApp.controller('MainController', function ($scope) {
var person = {
firstName: "Keith",
lastName: "Jackson",
};
$scope.message = "Welcome, Angular !";
$scope.person = person;
});
<html ng-app="ContrlApp">
<head>
<script type="text/javascript" src="Scripts/angular.js"></script>
<script type="text/javascript" src="Scripts/angular-route.js"></script>
<script type="text/javascript" src="Scripts/script.js"></script>
<!--<link rel="stylesheet" href="style.css" />-->
<title>Angular JS Tryout</title>
</head>
<body ng-controller="MainController">
<div>
<h1>{{message}}</h1>
<div>
<div>First name: {{person.firstName}}</div>
<div>Last name: {{person.lastName}}</div>
</div>
</div>
</body>
</html>

Develop Reference

JavaScript is the programming language of the Web.

ngRoute is not working in AngularJS - javascript

In your html, should this entry: <script src="angular/angular-route.js"></script> ... be changed to this, so that it matches the location to the other angular files? <script src="lib/angular/angular-route.js"></script>

Related

Problems on the generated value of the qr code into a input field using JavaScript

Angularjs ngRoute is not working

Creating a Search on AngulaJs: Uncaught Error: [$injector:modulerr]

Scripts don't load: Using AngularJS with JSON (Firebase)

Angular controller not working

Categories

Resources