CODEWITHSUNDEEP
angularjsplunker
Chanchal
Chanchal

Reputation: 57

Why simple Angular hello world is not working?

I have been trying to do some proof of concept and I was expecting Plunker to write 4 for the expression {{40/10}} but it never did. What's wrong with it? However I see Scott Allen was able to do so. Here is my plunker link: https://plnkr.co/edit/OTuxWEMmlWObMgGy9o2Z?p=preview

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@*" data-semver="2.0.0"
    src="https://code.angularjs.org/2.0.0-beta.0/angular2.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app>
    <h1>Hello Plunker!</h1>
    {{40/10}}
  </body>

</html>

Upvotes: 0

Views: 268

Answers (2)

jeerbl
jeerbl

Reputation: 7867

This is because the script you import is Angular 2. If you import Angular 1.x.x, your example will work.

<!DOCTYPE html>
<html>

  <head>
    <script src="https://code.angularjs.org/1.5.0/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app>
    <h1>Hello Plunker!</h1>
    {{ 40/10 }}
  </body>

</html>

If you want to learn how to use Angular 2, look at their website.

Upvotes: 3

Ali Al Amine
Ali Al Amine

Reputation: 161

You are linking to angular2 while using an angular1 directive ng-app.

Here is a link to a working plnkr link

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@*" data-semver="2.0.0"
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app>
    <h1>Hello Plunker!</h1>
    {{ 40/10 }}
  </body>

</html>

Angular 2 is a complete redesign from angular1, so a code working in Angular 1 will not work in Angular 2.

Upvotes: 0

Related Questions