Angular-js doesnt work when I add "ng-controller"

Question

I am new to web development, trying to learn angularjs, and got stuck at very first step, this code works fine when I remove ng-controller but in this condition the browser shows Hello, {{name}}.

What am I doing wrong?

index.html

  <!DOCTYPE html>
  <html lang="en" ng-app="app" ng-controller="AppCtrl" >
    <head >
        <script src="js/angular.min.js"></script>
        <script type="text/javascript" src="js/controller.js"></script>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <meta character="uft-8">
    <title></title>
    </head>
    <body>
        <h1>Hello, {{name}}</h1>
        <input type="text" ng-model="name">
    </body>
  </html>

controller.js

  function AppCtrl($scope)
  {
    $scope.name: "world";
  }

Can you please provide what the question is and/or error message? — Vedda
– Vedda, Commented Dec 20, 2015 at 6:37

Anik Islam Abhi · Accepted Answer · 2015-12-20 06:55:33Z

2

You are calling module named app which you didn't declared.

<html lang="en" ng-app="app" ng-controller="AppCtrl" >

If you provide module name then controller have to bind with that module.

To assign a value you have to use = not :

$scope.name: "world";

Try Like this

$scope.name= "world";

Moreover Global controller isn't allowed from 1.3.x

Try like this

var app = angular.module("app", []);
app.controller("AppCtrl", function($scope) {
   $scope.name= "world";
});

JSFIDDLE

edited Dec 20, 2015 at 6:55

answered Dec 20, 2015 at 6:38

Anik Islam Abhi

25.4k8 gold badges61 silver badges82 bronze badges

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

3 Comments

utkarsh tyagi Over a year ago

Hi, thanks for replying, but I have tried doing this, it still doesn't work, what else could be the problem in this?

utkarsh tyagi Over a year ago

Hi, it works now, thank you very much, you the real MVP.

AlainIb Over a year ago

i read (yesterday) on official doc that making 'var app = angular.module("app", []); app.controller(..) ' is bad practice. better to do : 'angular.module("app", []); angular.module("app").controller();'

Collectives™ on Stack Overflow

Angular-js doesnt work when I add "ng-controller"

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related