Hima replied to the topic 'How to create a controller in Angular JS?' in the forum. 1 year ago

Syntax is
<module name>.controller("<Controller name", function())

<script>
var x= angular.module("Module",[]);
x.controller("Controller", function($scope)
{
$scope.city="Hyderabad";
}

</script>

Read More...

Hima replied to the topic 'How to link your controller to HTML code?' in the forum. 1 year ago

To bind Controller to HTML, we need to use ng-controller
Example:

<!--Defining a Module and controller -->
<script>
var app= angular.module('Module, []');
app.controller('controller', function($scope))
{
$scope.name="XYZ"
}
</script>

<!-- Binding Module and controller to html-->
<div ng-app="Module1">
<div ng-controller="Controller">
</div>
Welcome {{name}}!
</div>

Read More...

Hima replied to the topic 'Create a simple application like gmail Inbox?' in the forum. 1 year ago

<!--Import Angular JS library scrpit-->
<script src=" ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js ">
</script>

<!--Binding Module to HTML using ng-app-->
<div ng-app="gmail">

<!--Binding Controller to HTML using ng-controller-->
<div ng-controller="Display">

<!-- HTML tag to Add a Heading-->
<h1>
Welcome {{name}} to Gmail
</h1>

<p>
<!-- Adding an input textbox with a place holder text search -->
<input type='text' ng-model="Key" placeholder="Search">
</p>

<!-- Dispalys number of mails by using length operator from messages object-->
<h3>
Inbox ({{messages.length}})
</h3>

<!--ng-repeat loops through the object and filters message using 'Key' entered in the text box above -->
<div ng-repeat="mails in messages|filter:Key">

<b>
{{ mails.subject}}
</b>
</br>
<i>
{{ mails.body}}
</i>
</div>


</div>
</div>

<!-- script tag is used to include Angular JS code-->
<script>

<!--Defining a Module-->

var app= angular.module('gmail',[]);

<!--Defining a controller-->
app.controller('Display', function($scope)
{
$scope.name='Hima';

<!--this the Jason object which has an object 'messages' with properties 'subject' and 'body'-->

$scope.messages=[
{subject:'Hi!', body:'Hi!, How are you? its been a long time'},
{subject:'Call Me', body:'Call me when possible'},
{subject:'Advice Needed', body:'I am totally stuck, Can you please advice what to do next?'},
{subject:'Hi Again', body:'Hi!, How are you? Call me'},
{subject:'Help Needed', body:'I need your help'},
{subject:'Beautiful Day', body:'Its a beautiful day out, why dont we go out?'},
{subject:'Surprise', body:'Click here to get your surprise'},
{subject:'Learn Angular JS', body:'Here is your opportunity to learn Angular JS'},
{subject:'Modules', body:'Angular JS contains Modules'},
{subject:'Controllers', body:'Modules contains one or more controllers'},
{subject:'Logic', body:'Each controller contains a logic'},
{subject:'Binding', body:'Modules and controlers need to be binded to html using ng-app and ng-controller'},
{subject:'Object', body:'Object is used to store data, it contains properties'},
{subject:'calling data from obect', body:'to access data from object use ng-repeat loop through the data in the object'},
{subject:'Modules', body:'Angular JS contains Modules'},
{subject:'Controllers', body:'Modules contains one or more controllers'},
{subject:'Logic', body:'Each controller contains a logic'},
{subject:'Binding', body:'Modules and controlers need to be binded to html using ng-app and ng-controller'},
]
}
);


</script>

Read More...