Friday 4 March 2016

Drop down data binding from view to controller in Ionic

Hi,

Here i am sharing a way by which, we can bind data from view to controller by using drop down.

Run following sets of command in your terminal-

ionic start myApp blank
cd myApp
ionic platform add android

Add following lines of code in your index.html file-

<div ng-controller="MyAppCtrl">
<select
    ng-change="changed()"
    ng-model="regions"
    ng-options="data.name for data in options">
</select>
    <pre>{{ regions | json }}</pre>
</div>
  

And add following lines of code in your app.js file-


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

myApp.controller('MyAppCtrl',function( $scope){
 $scope.options = [
        {id: 1, name: 'A'},
        {id: 2, name: 'B'},
        {id: 3, name: 'C'}
    ];
 
    $scope.changed = function() {
        console.log($scope.regions);
    }
});
Here when you change option in your html page, you will get that value in your controller.

Thanks...
   





No comments:

Post a Comment