Ng-Click-7

 

In this example we can create list of options with ng-options directive.Selected textbox value will bind to myName variable with ng-model directive.If we click on button it will call the executeFunction(myName) with selected value as parameter which display alert of selected value of textbox.

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Welcome to LearnKode - A code learning platform</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> </head> <body ng-app="clickExample"> <div ng-controller="ExampleController"> <div class="container" ng-init="names=[{name:'John'},{name:'Eric'},{name:'Hellen'}]"> Name <select class="form-control" ng-model="myName" ng-options="name.name as name.name for name in names"></select><br /><br /> <input class="btn btn-primary" type="button" value="Run" ng-click="executeFunction(myName)" /> </div> </div> <script> var app = angular.module("clickExample", []); app.controller('ExampleController', ['$scope', function ($scope) { $scope.executeFunction= function (myName) { if(myName != undefined) alert(myName); } }]); </script> </body> </html>
Output