Angular JS not rendering HTML

Question

I am new to Angular JS. I wrote a simple Angular code but the HTML is not rendering correctly or the expression is not getting evaluated. Please help with what i am missing. I am using angular.min.js minified(1.6).

<!DOCTYPE html>
<html ng-app>
    <head>
        <script src="js/angular.min.js"></script>
        <script>
            function MyFirstCtrl($scope) {
            var employees = ['Catherine Grant', 'Monica Grant',
               'Christopher Grant', 'Jennifer Grant'];

            $scope.ourEmployees = employees;
            };
        </script> 
    </head>
    <body ng-controller='MyFirstCtrl'>
        <h2>Number of Employees: {{ ourEmployees.length}}</h2>      
    </body>
</html>

Read the angular docs to get started..docs.angularjs.org/tutorial — user2427829
– user2427829, Commented Nov 24, 2016 at 10:16

SLePort · Accepted Answer · 2016-11-24 10:38:07Z

2

Set a root for your application with the ng-app directive and create a controller for your app from which you can handle the $scope:

var app = angular.module("ng-app", []);
app.controller("myCtrl", function($scope) {
  var employees = ['Catherine Grant', 'Monica Grant', 'Christopher Grant', 'Jennifer Grant'];
  $scope.ourEmployees = employees;

});

<!DOCTYPE html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="ng-app">
<div ng-controller="myCtrl">
  <h2>Number of Employees: {{ ourEmployees.length}}</h2>
  </div>
</div>

edited Nov 24, 2016 at 10:38

answered Nov 24, 2016 at 10:22

SLePort

15.5k3 gold badges40 silver badges45 bronze badges

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

Collectives™ on Stack Overflow

Angular JS not rendering HTML

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related