I've used CDNs for all my scripts but I get the error
"Uncaught SyntaxError: Unexpected token <"
I've been stuck on this for hours, and I don't know why there's an error.
<!-- File: chapter10/simple-routing.html -->
<html>
<head>
<title>AngularJS Routing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
<script src="https//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"> </script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular-route.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.8/angular-cookies.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.8/angular-resource.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.8/angular-sanitize.js"></script>
</head>
<body >
<h2>AngularJS Routing Application</h2>
</body>
</html>
typo:
https//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js
^^
Related
trying to use cropper.js:
https://github.com/fengyuanchen/cropperjs
https://fengyuanchen.github.io/cropperjs/
After downloading and unpacking files I created index.php on the root level:
<!doctype html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<title>IMGED</title>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<link href="src/index.css" rel="stylesheet">
</head>
<body>
<div>
<img id="image" src="img.jpg" alt='img'>
</div>
<script src="src/index.js"></script>
</body>
</html>
Console:
Uncaught SyntaxError: Unexpected identifier... index.js:1
index.js
import Cropper from './js/cropper';
export default Cropper;
What is wrong, pls?
I'm working on an app in angular 2/ nodejs and I'm trying to bootstrap the application. I've defined the root component in app.component.ts:
import {Component} from 'angular2/core';
#Component({
selector: 'pm-app',
template:`<div><h1>{{pageTitle}}</h1>
<div>My First Component</div>
<div>`
})
export /**
* name
*/
class AppComponent {
//constructor(parameters) {}
pageTitle: string = "Acme Product Managment";
}
and when the app loads, the page title should be injected into the index.html page in the <pm-app> tag:
(index.html)
<html>
<head>
<title>Angular 2 QuickStart</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href= "node_modules/bootstrap/dist/css/bootstrap.css" rel= "stylesheet" />
<link rel="app/app.component.css" href="styles.css">
<!-- 1. Load libraries -->
<script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<!-- Polyfill(s) for older browsers -->
<script src= "node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src= "node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<!-- 2. Configure SystemJS -->
<script src="systemjs.config.js"></script>
<script>
System.config({
packages:{
app:{
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/main').then(null, console.error.bind(console));
</script>
</head>
<!-- 3. Display the application -->
<body>
<pm-app>Loading App</pm-app>
</body>
</html>
For some reason, when the page renders, only the "Loading App" text shows which I think indicates that the bootstrapping process wasn't successful. When I open the dev console, I get the following errors:
shims_for_IE.js:2 Uncaught SyntaxError: Unexpected token <
es6-shim.min.js:2 Uncaught SyntaxError: Unexpected token <
system-polyfills.js:2 Uncaught SyntaxError: Unexpected token <
angular2-polyfills.js:2 Uncaught SyntaxError: Unexpected token <
system.src.js:2 Uncaught SyntaxError: Unexpected token <
Rx.js:2 Uncaught SyntaxError: Unexpected token <
angular2.dev.js:2 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:2 Uncaught SyntaxError: Unexpected token <
localhost/:23 Uncaught ReferenceError: System is not defined
All of these packages should be installed so what could be the problem?
When I am adding
<script src="/js/angular.min.js"></script>
in my html page, then I am getting this strange error
Error:-
Error: [$injector:modulerr] http://errors.angularjs.org/1.5.0-rc.0/$injector/modulerr?p0=letsendorse&p1=%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.5.0-rc.0%2F%24injector%2Fnomod%3Fp0%3Dletsendorse%0AP%2F%3C%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A6%3A421%0Age%2F%3C%2F%3C%2F%3C%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A24%3A99%0Ab%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A23%3A149%0Age%2F%3C%2F%3C%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A23%3A1%0Ag%2F%3C%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A39%3A201%0An%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A7%3A342%0Ag%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A39%3A49%0Afb%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A42%3A360%0Azc%2Fc%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A19%3A421%0Azc%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A20%3A225%0Abe%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A19%3A41%0A%40http%3A%2F%2Fdev.letsendorse.com%2Fjs%2Fangular.min.js%3A303%3A112%0Ab.Callbacks%2Fc%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.9.1%2Fjquery.min.js%3A3%3A7852%0Ab.Callbacks%2Fp.fireWith%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.9.1%2Fjquery.min.js%3A3%3A8658%0A.ready%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.9.1%2Fjquery.min.js%3A3%3A3264%0AH%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.9.1%2Fjquery.min.js%3A3%3A693%0A
Here is my html -
<html ng-app="letsendorse">
<head>
<script src="/js/jquery.min.js"></script>
<script src="/js/angular.min.js"></script>
</head>
<body>
<div ng-controller="indexCtrl">
abc
</div>
</body>
</html>
Please help
Without declaring module in js you are assing it in view
Try like this
<html ng-app="letsendorse">
<head>
<script src="/js/jquery.min.js"></script>
<script src="/js/angular.min.js"></script>
<script>
var app=angular.module("letsendorse",[]);
app.controller("indexCtrl",function($scope){
});
</script>
</head>
<body>
<div ng-controller="indexCtrl">
abc
</div>
</body>
</html>
I'm learning backbone and I'm trying to execute this sample code to get the feel.
http://backbonetutorials.com/what-is-a-view/
My code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>hello-backbonejs</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
<script src="http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.6/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<script type="text/javascript">
Rocky = Backbone.Model.extend({
initialize: function(){
console.log('hello world');
}
});
</script>
</body>
</html>
I get this error.
Uncaught type error: Undefined is not a function!
What did I do wrong? I was just trying to print and see if it's printed on my console!
Thanks,
R
Your underscore.js version is too old. Try to use the new version (1.7):
<script src="http://underscorejs.org/underscore.js"></script>
Here is my code:
<html>
<head>
<script type="text/javascript" language="javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
alert('hei');
});
</script>
</head>
<body>
<input type="button" id="btn" />
</body>
</html>
I'm getting an "object not supported" error on $(document).ready. I'm also getting this error: Uncaught SyntaxError: Unexpected token ILLEGAL
Your code seems to be correct, it looks like jQuery file is not loaded, verify that it has correct path.
This works:
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() { alert('hi'); });
</script>
</head>
<body>
</body>
</html>