Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question does not appear to be about programming within the scope defined in the help center.
Closed 9 years ago.
Improve this question
Guys please check my below code, Why its not working..
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body ng-app>
<h1 ng-controller="HWCtrl">{{helloMessage}}</h1>
<srcipt src="angular.js"></srcipt>
<script type="text/javascript">
function HWCtrl($scope) {
$scope.helloMessage = 'Hello World';
}
</script>
</body>
I created HWCtrl function for a ng-controller.. Thanks in advance
You misspelled script:
<srcipt src="angular.js"></srcipt>
^-- here ^-- and here
Related
This code should evaluate the part in between the double curly braces according to a tutorial I'm following. I'm new to angularjs. So, pardon me if I'm asking silly question. Here's the link to plnkr http://plnkr.co/edit/sFhDiA?p=preview
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js#2.0.0" data-semver="2.0.0" src="https://code.angularjs.org/2.0.0-snapshot/angular2.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app>
<h1>Hello Plunker!</h1>
<div> {{ 78 + 8 }} </div>
</body>
</html>
You are missing your ng-app directive name on your html. Which means Angular won't run on your page.
Look into the ngApp documentation here. You can get a clear idea from there!
Similar SO question is also available here
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
just try the following code and getting the error
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Routing Intro</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>
<script scr="example.js"></script>
</head>
<body ng-app="mainApp">
<div ng-view></div>
</body>
</html>
here is my example.js file
var application = angular.module ('mainApp', ['ngRoute']);
application.config (function ($routeProvider){
$routeProvider
.when('/', {
template : 'Welcome User!'
})
.when('/anotherPage',{
tempalte : 'Welcome to Another page'
})
otherwise ({
redirectTo : '/'
});
});
I am getting the following error
angular.js:4458 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=mainApp&p1=Error%3A…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.8%2Fangular.min.js%3A19%3A463)
Angular router is not a part of core angular module. You need to include it's javascript file:
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.min.js"></script>
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
hi below is the code that i have written, it's tutorial example from the internet (https://cdnjs.com/libraries/backbone.js/tutorials/what-is-a-view/)
<<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js" type="text/javascript"></script>
</head>
<body>
<div id ="search_container">a</div>
<script type="text/template" id="search_template">
<label>Search</label>
<input type="text" id='search_input' />
<input type="button" id="search_button" value="search" />
</script>
<script type="text/javascript">
SearchView = Backbone.View.Extend({
initialize: function(){
this.render();
},
render: function(){
// Compile the template using underscore
var template = _.template($('search_template').html(),{});
// Load the compiled HTML into the Backbone "el"
this.$el.html(template);
},
events:{
"click input[type=button]": "doSearch"
},
doSearch: function(){
alert("search for " + $('#search_input').val());
}
});
var search_view = new SearchView({el: $('#search_container')});
</script>
</body>
</html>
I do not understand what i am doing wrong, Please guide me. thanks
nikoshr is right you have to use extend with lowercase and form making work the example you must change
var template = _.template($('search_template').html(),{});
to
var template = _.template($('#search_template').html(),{});
This question already has answers here:
AngularJS angular-seed starter project adding directives
(2 answers)
Closed 7 years ago.
this is my first try to write a directive.....and i tried to do my best.
index.html
<!doctype html>
<html lang="en" ng-app="APP">
<head>
<meta charset="utf-8">
<title>Custom Directive</title>
</head>
<body>
<personName fname="Debditya" lname="Dasgupta"></personName>
<script src="bower_components/angular/angular.min.js"></script>
<script src="app.js"></script>
</body>
</html>
app.js
var APP = angular.module('APP',[]);
APP.directive('personName',function() {
return{
restrict:"E",
link:function(scope,element,attrib){
scope.fullName = attrib.fname + " "+ attrib.lname;
console.log(scope.fullName);
},
replace:true,
template:"<h1>{{fullName}}</h1>"
}
});
My problem is that directive not rendering anything. Why is the directive not rendering correctly?
You code appears to be working :) in your dom, just change
<personName>
to <person-name> :)
personName in your HTML should be person-name, from Angular documentation:
The normalization process is as follows:
1- Strip x- and data- from the front of the element/attributes.
2- Convert the :, -, or _-delimited name to camelCase.
See Normalization for more details
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
I am new to AngularJS so I've been doing some tutorials and following some sample videos. I came across a very simple application but I cannot get it to run in my browser. Can anyone tell me what's wrong with my code?
<!DOCTYPE html>
<html ng-app="hello">
<head lang="en">
<title>My HTML 5 Page</title>
</head>
<body>
<h1>{{hello}}</h1>
<input type="text" ng-model="hello" />
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.6/angular.min.js" />
</body>
</html>
Do I have to run this from a webserver? Can I not run this in just the browser? I've tried both ways and neither way worked for me. I just end up with a big {{hello}} -
{{hello}}
and there's no text input box and definitely no binding. Do I need all the other dependencies? Shouldn't the script tag line contain everything I need?
I do not have any modules or anything else. Just an HTML file with those lines of code.
Thanks for any insight you gurus might shed on this mystery.
You should check your console for errors which will probably tell you something like the module hello is not defined.
The above will only work if you have a script that runs angular.module("hello", []) or if you simply remove hello and just use ng-app with no argument.
Turns out it was 2 things...
I needed to remove the "hello" from ng-app
I cannot self-close a script tag. Finally code that worked:
<!DOCTYPE html>
<html ng-app>
<head lang="en">
<title>My HTML 5 Page</title>
</head>
<body>
<h1>{{hello}}</h1>
<input type="text" ng-model="hello" />
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.6/angular.min.js">
</script>
</body>
</html>
<html ng-app="page">
<head lang="en">
<title>My HTML 5 Page</title>
</head>
<body>
<div ng-controller="PageController as page" >
<h1>{{page.product.message}}</h1>
<input type="text" ng-model="hello" />
</div>
</body>
</html>
<script type="text/javascript" src="lib/angular.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</html>
code for app.js
<html ng-app="page">
<head lang="en">
<title>My HTML 5 Page</title>
</head>
<body>
<div ng-controller="PageController as page" >
<h1>{{page.product.message}}</h1>
<input type="text" ng-model="hello" />
</div>
</body>
</html>
<script type="text/javascript" src="lib/angular.min.js"></script>
<script type="text/javascript" src="js/app1.js"></script>
</html>