Monday 3 April 2017

Topic (Angular) 2 - Application Controller

Application Controller


Today we are going to explore a few things regarding controller inside ionic app. In controller we have a controller name , a dependency function and their properties.

Lets look at this example : 

.controller('StoreController',function(){
  this.product = gem;
});

In above example we can see that our controller was named as StoreController and the respect property is gem . This gem object will hold attributes variable that will define below : 

var gem = {
  name : 'emerald',
  price : 99.99,
  description : 'This gem is a rare shiny object',
}

After we have define the details of attributes variable gem that we appoint to product property we can call these attribute inside our html page . Lets say in our html we declare a div and a directive ng-controller to the controller we declare inside Angular JS file.

Index.html 

<div ng-controller="StoreController as store">
            <h1> {{store.product.name}}</h1>
            <h2> ${{store.product.price}}</h2>
            <p>{{store.product.description}}</p>
</div>
The result will be like this : 















No comments:

Post a Comment