Angular variable not being show properly on webpage

Question

Just as the title suggests, I'm trying to self learn Angular.js but I run into an unexpected frustrating road block... I can't even get the variables to display properly on the webpage!

<!DOCTYPE html>
<html ng-app>
<head>
    <title>Lets test this out?</title>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>

    Write your name in the text box!
    <input type="text" ng-model="sometext" />    
    <h1>Hello {{ sometext }}</h1>

</body>
</html>

I'd greatly appreciate anyone that can tell me what I am doing wrong as I've been beating my head against my desk for an hour and googled this issue but I can't understand why it doesn't work.

It's working here plnkr.co/edit/K8zEYdUhiun2qAgQU2Hi?p=preview — Aayushi Jain
– Aayushi Jain, Commented Jul 25, 2017 at 11:07

Sajeetharan · Accepted Answer · 2017-07-25 11:06:20Z

3

Check your angular reference has been loaded properly. Try to add ng-app to your body tag

DEMO

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app>
    Write your name in the text box!
   <input type="text" ng-model="sometext" />
   <h1>Hello {{ sometext }}</h1>
</body>

answered Jul 25, 2017 at 11:06

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

K. Awuah Over a year ago

You're right, i ran it through a few online HTML5 situations and it worked, it might be the IDE i'm using (Angular IDE 2017) for some reason its not even rendering the code properly...

Dps · Accepted Answer · 2017-07-25 11:24:06Z

0

This is work perfect just you have to remove first tag

´

<html ng-app>
<head>
    <title>Lets test this out?</title>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js</script>
</head>
<body>

    Write your name in the text box!
    <input type="text" ng-model="sometext" />

    <h1>Hello {{ sometext }}</h1>

</body>
</html>

´

answered Jul 25, 2017 at 11:24

Dps

713 bronze badges

Collectives™ on Stack Overflow

Angular variable not being show properly on webpage

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related