javascriptangularjsangularjs-scopeangularjs-controllerng-app

Angular JS: unable to display value

I am a new learner of Angular JS. Please help me to find reason why this demo only display : {{name}} instead of showing each values, 

 <!DOCTYPE html>
<html>
    <head>
        <title>AngularJS Demos</title> 
    </head>
    <body> 
        <div class="container" data-ng-app="demoApp" data-ng-controller="SimpleController">
            <h3>Adding a Simple Controller</h3>
            <ul>
                <li data-ng-repeat="name in names">{{name}}</li>
            </ul>
        </div> 
        <script  type="text/javascript">
            var samplesModule = angular.module('demoApp', []); 
            samplesModule.controller('SimpleController', SimpleController);
            function SimpleController($scope) {
                $scope.names = ['Dave', 'Napur', 'Heedy', 'Shriva'];
            }
        </script> 
        <script src="https://code.angularjs.org/1.3.9/angular.js"></script> 
    </body>
</html>
Solution

  • First thing move angularjs cdn file reference before custom script to make angular object available before using it.

    Thereafter do add ng-app="samples" on html element & ng-controller="SimpleController" on body tag will solve your issue. (Removed above line as OP modified his code after I answered).

    Demo Here