Problem with Creation and location of module by AngularJS

0

Look at the code;

<!DOCTYPE html ng-app="helloWword">
<html>
<head>
    <title>Ola Mundo</title>
    <script src="angular.js"></script>
    <script>
        angular.module("helloWword", []);
        angular.module("helloWword").controller("helloWwordCtrl", function ($scope) {
            $scope.message = "Ola mundo";
        });
    </script>
</head>
<body>
<div ng-controller="helloWwordCtrl">
    {{message}}
</div>
</body>
</html>

As you can see, I'm creating the model here in this line;

angular.module("helloWword", []);

And here I am causing the module to be localized;

    angular.module("helloWword").controller("helloWwordCtrl", function ($scope) {
        $scope.message = "ESTA APARECENDO NO SITE";
    });
</script>

and the line of code was supposed to appear THIS IS APPEARING ON THE SITE on the browser screen, which is not what happens, it just appears {{message}}

What did I do wrong?

    
asked by anonymous 15.05.2016 / 12:00

1 answer

1

Your error is in the first two lines:

<!DOCTYPE html ng-app="helloWword">
<html>

You need to declare the app at the beginning of html and not in the declaration of the file type. Although a best practice is to declare ngApp in body as Sergio ♦ has already commented. To work the code should look something like:

<!DOCTYPE html>
<html ng-app="helloWorld">
<head>
  <title>Hello World</title>
</head>
<body>
  <div ng-controller="teste">
    {{message}}
  </div>

  <script src="angular.min.js"></script>
  <script>
  var app = angular.module("helloWorld", []);

  app.controller('teste', function ($scope) {
    $scope.message = "Hello from the other side!!";
  });

  </script>
</body>
</html>
    
15.05.2016 / 12:32