ng-checked with an example

ng-checked : This directive sets the checked attribute of a checkbox/radiobutton. It will check for the expression in the ng-checked attribute which is mapped with the ng-model in the "check all" checkbox. It is supported by <input> elements of type checkbox / radio.


ng-change with an example

ng-change - This directive operates like jQuery's change event listener (onChange). It requires a ng-model directive in the element. The ng-change event is triggered at every change in the value or while adding value in the input box it will not check for all the values inserted, it will occur whenever there is a change in the inputbox. Please check the below example :


ng-bind with example

c) ng-bind - The ng-bind directive will notify AngularJS to update the content of an HTML element with the value provided in the application scope variable.
   Different types of bindings :
1) One way binding using ng-bind
Example : 
         Controller :
          var app = angular.module('store', []);
app.controller('myStore', function($scope) {
     $scope.stname = "Van husen";
     $scope.staddress = "Germany";
   });

         view : <p ng-bind="stname"></p>
2) Two way binding using ng-bind
Example :
        View :
        <div ng-app="store" ng-controller="myStore">
        Name: <input ng-model="stname">
        <h1>{{stname}}</h1>
        </div>
        <a ng-click="getvalue"></a>

       Controller :
  var app = angular.module('myApp', []);
  app.controller('myStore', function($scope) {
         $scope.stname = "Van husen";
          $scope.staddress = "Germany";
           $scope.getvalue = fucntion(){
              console.log($scope);
              }
  });


ng-init with example

b) ng-init - It initializes the variable in the app. ng-init will not create a new scope, it adds an expression in the current scope. To create  seperate scope use ng-controller

   For ex:
   Controller :
store.controller('ListController', function($scope) {  
});


   To add expression in the same scope using ng-init :

    <div ng-init="model = { score: '204'}">
      <a href="" ng-click="model.score = '204'">204</a> | <a href=""ng-click="model.score=  '105'">105</a>
      <div>Display {{ model.score }}</div>
      <hr />
      </div>


    To create seperate scope using ng-init :

     <div ng-controller="ListController" ng-init="model = { score: '204'}">
      <a href="" ng-click="model.score = '204'">204</a> |  <a href="" ng-click="model.score = '105'">105</a>
      <div>Display {{ model.score }}</div>
      <hr />
    </div>