My Angular2 app runs in Chrome, Firefox, and Safari, but not Internet Explorer. It finds an error in angular2.min.js: SyntaxError: Expected ';'
Here's my HTML file:
<!DOCTYPE html>
<html>
<head>
<title>My Component</title>
<script src="../../../../node_modules/es6-shim/es6-shim.min.js"></script>
<script src="../../../../node_modules/systemjs/dist/system-polyfills.js"></script>
<script src="../../../../node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="../../../../node_modules/systemjs/dist/system.src.js"></script>
<script src="config.js"></script>
<script src="../../../../node_modules/rxjs/bundles/Rx.min.js"></script>
<script src="../../../../node_modules/angular2/bundles/angular2.min.js"></script>
<script>
System.import("./app/main").catch(console.log.bind(console));
</script>
</head>
<body>
<my-comp></my-comp>
</body>
</html>
This is essentially similar to the HTML in Angular's 5 Min Quickstart, but I still get the error in IE. Any ideas?
Finally there is a workaround for the issue (2nd comment).
What worked for me was to include the script 'https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js':
<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<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>
Related
This is my folder structure on the server:
How do you start the angular JS app inside the AngularJSAPP folder from index in the current folder?
Angular JS app
how should the link look like?
When I tried something like:
Angular JS app
the server returned code 404. it cant find the files.
<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-route/angular-route.js"></script>
<script src="node_modules/jquery/dist/jquery.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.js"></script>
<script src="app.module.js"></script>
<script src="app.routes.js"></script>
<script src="services/data.service.js"></script>
<script src="services/user.service.js"></script>
<script src="services/localstorage.service.js"></script>
<script src="services/data.salescharts.service.js"></script>
<script src="directives/directives.js"></script>
<script src="js/admincontroller.js"></script>
<script src="js/carcontroller.js"></script>
<script src="js/logincontroller.js"></script>
<script src="js/saleschartcontroller.js"></script>
<script src="js/registercontoller.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
According to information from comments.
You need to add ../ before every path.
Without that browser is trying to find files in the same directory with index.html.
<script src="../node_modules/angular/angular.js"></script>
<script src="../node_modules/angular-route/angular-route.js"></script>
<script src="../node_modules/jquery/dist/jquery.js"></script>
......
I tried to add to textarea a line of the row numbers with this example:
http://alan.blog-city.com/jquerylinedtextarea.htm
this is my code and I allready use the css and js in my project:
<!DOCTYPE html>
<html>
<head>
<title>CODE</title>
<link href="jquery-linedtextarea.css" rel="stylesheet">
<script src="jquery-linedtextarea.js"></script>
</head>
<body>
<textarea class="lined" name="mytext"></textarea>
<script>
$(function () {
$(".lined").linedtextarea(
{ selectedLine: 1 }
);
$("mytext").linedtextarea();
});
</script>
</body>
</html>
what I wrong ?
It seems you forget to call Jquery Library...
Just add the code below on your <head>:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"> </script>
And I believe you should delete that part:
$("mytext").linedtextarea();
I've made a code. It works for me. Check it out...
<html>
<head>
<title>JQuery LinedTextArea Demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="http://files.aw20.net/jquery-linedtextarea/jquery-linedtextarea.js"></script>
<link href="http://files.aw20.net/jquery-linedtextarea/jquery-linedtextarea.css" type="text/css" rel="stylesheet" />
</head>
<body>
<h1>JQuery LinedTextArea Demo</h1>
<p>Add a scrollable lined area to a standard TextArea control.</p>
<textarea class="lined" rows="10" cols="60">
JavaScript was originally developed by Brendan
Eich of Netscape under the name Mocha,
which was later renamed to LiveScript,
and finally to JavaScript.
The change of name from LiveScript to JavaScript roughly
coincided with Netscape adding support for
Java technology in its Netscape Navigator
web browser.
</textarea>
<script>
$(function() {
$(".lined").linedtextarea(
{selectedLine: 1}
);
});
</script>
</body>
</html>
I'm using Foundation 5 magellan navigation but smooth scroll doesn't work. In example all is fine: http://foundation.zurb.com/docs/components/magellan.html
My code: http://jsfiddle.net/5LKzf/
<head>
<link rel="stylesheet" href="css/foundation-5.2.2/css/foundation.css" />
<link rel="stylesheet" href="css/foundation-5.2.2/css/normalize.css" />
<script src="css/foundation-5.2.2/js/vendor/modernizr.js"></script>
</head>
<body>
//my link
<li class="item-109 menu-el active"><dd data-magellan-arrival="/"><a href="#/" >Main Page</a></dd></li>
//my anhor
<a class="link-pos" data-magellan-destination="/" name="/"> </a>
<script src="css/foundation-5.2.2/js/vendor/jquery.js"></script>
<script src="css/foundation-5.2.2/js/vendor/fastclick.js"></script>
<script src="css/foundation-5.2.2/js/foundation.min.js"></script>
<script>
$( document ).foundation();
</script>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/main.js"></script>
</body>
Did I forget to include any files?
According to the docs
"Make sure jquery.js, foundation.js, and foundation.magellan.js have been included on your page before continuing. For example, add the following before the closing tag:"
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation/foundation.js"></script>
<script src="js/foundation/foundation.magellan.js"></script>
According to the code you posted, you are missing the magellan js, which would explain why it doesnt work!
I have worked with Foundation 5, and with some features you need to ensure you include the relevant javascript.
I hope this helps!
I'm trying to prompt for a value that will replace the value for "data-amount"
<html>
<body>
Bank Account (25¢)
<script type="text/javascript" src="https://www.dwolla.com/scripts/button.min.js"> </script>
</body>
</html>
I've added
<script type="text/javascript">
document.getElementByClass("dwolla_button")[0].setAttribute("data-amount", "43");
</script>
and tried the whole thing in this script below with no success any ideas?
<html>
<body>
Bank Account (25¢)
<script type="text/javascript">
document.getElementByClass("dwolla_button")[0].setAttribute("data-amount", "43");
</script>
<script type="text/javascript" src="https://www.dwolla.com/scripts/button.min.js"> </script>
</body>
</html>
Change your method from getElementByClassName to getElementsByClassName
document.getElementsByClassName("dwolla_button")[0].setAttribute("data-amount", "43");
i am pretty new to mootools, i found it faster/smoother for animations than jquery so i decided to give it a try.
I don't get why the following code is not working, it is working on jsfiddle with Mootools core and Mootools more 1.3.1
<html>
<head>
<script src="mootools-more-1.3.1.1.js" type="text/javascript"></script>
<script src="mootools-core-1.3.1-full-compat.js" type="text/javascript"></script>
<script type="text/javascript">
window.addEvent('domready', function() {
var myVerticalSlide = new Fx.Slide('paragraph', {mode:'horizontal'}) ;
$('v_slideout').addEvent('click', function(event){
event.stop();
myVerticalSlide.toggle();
});
});
</script>
</head>
<body>
<div id="paragraph">This is a paragraph.</div>
<a id="v_slideout" href="#">Test</a>
</body>
</html>
Can't seem to figure it out, i only could get it worked on jsfiddle.
Any suggestion is appreciated.
Edit: http://jsfiddle.net/F54s3/ << It doesn't work as it should in FF but still it does something, on Opera it seems fine though.
I might have messed up the code as i am pretty new to it, but i am trying to figure out why it works on jsfiddle and doesn't work on my index.html.
The order of your script includes looks suspicious to me:
<script src="mootools-more-1.3.1.1.js" type="text/javascript"></script>
<script src="mootools-core-1.3.1-full-compat.js" type="text/javascript"></script>
Shouldn't the mootools-core file come first?
For example:
http://jsfiddle.net/AxJq9/ (throws Javascript error)
<script src="http://mootools.net/assets/scripts/mootools.more.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.1/mootools.js" type="text/javascript"></script>
http://jsfiddle.net/AxJq9/1/ (doesn't throw an error)
<script src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.1/mootools.js" type="text/javascript"></script>
<script src="http://mootools.net/assets/scripts/mootools.more.js" type="text/javascript"></script>