Click here to Skip to main content
15,891,905 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
Am completely new to AngularJS. Need help to make the following code work:

HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Employee Profile</title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type='text/javascript' src="http://code.angularjs.org/1.0.1/angular-1.0.1.min.js"></script>

    <script type="text/javascript">

        var myApp = angular.module("myApp", []);

        $(document).ready(function () {
            myApp.controller("EmpCtrl", ['$scope', function ($scope) {
                $scope.FirstName = "Angular";
                $scope.LastName = "JS";
            } ]);
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div ng-app="myApp" ng-controller="EmpCtrl">
            {{ FirstName }}
            <br />
            {{ LastName }}
    </div>
    </form>
</body>
</html>
Posted
Updated 26-May-14 23:40pm
v2

1 solution

You don't need to run the code under document.ready(). it will work if u do like this.

HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Employee Profile</title>

    <script type='text/javascript' src="http://code.angularjs.org/1.0.1/angular-1.0.1.min.js"></script>
 
    <script type="text/javascript">
 
        var myApp = angular.module("myApp", []);
 
     
            myApp.controller("EmpCtrl", ['$scope', function ($scope) {
                $scope.FirstName = "Angular";
                $scope.LastName = "JS";
            } ]);
        
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div ng-app="myApp" ng-controller="EmpCtrl">
            {{ FirstName }}
            <br />
            {{ LastName }}
    </div>
    </form>
</body>
</html></html>
 
Share this answer
 
Comments
Code Help 2014 3-Jun-14 8:04am    
Thanks for the response. This code is a very simplified version of what I am trying to do. I need the code inside document.ready() or something similar. So this solution does not work in my case. I basically need to know in detail that what's wrong with this code, why it does not work inside document.ready().
vanandrao1 4-Jun-14 14:00pm    
$(document).ready(function(){
var myApp = angular.module("myApp", []);
myApp.controller("EmpCtrl", ['$scope', function ($scope) {
$scope.FirstName = "Angular";
$scope.LastName = "JS";
} ]);
});

</script>
<script type='text/javascript' src="angular.js"></script>

This is what the code should be if you want angular to run inside document.ready().include script of angular at the end as it excutes after html if declared first script written after that is not included under the module object.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900