Ng-Click-6

 

In this example we can set and clear the value of textbox.Button having Set Value text will disable if textbox is empty.If we type in textbox then click on Set Value button it will display the value of textbox and button having Clear Value text will clear the value of textbox and set the text Learn It.

 
 
 
<!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"> Name <input type="text" ng-model="myName" class='form-control' /><br /><br /> My name is: <b>{{name}}</b><br /><br /> <input ng-disabled="myName==null || myName==''" type="button" value="Set Value" ng-click="setValue(myName)" class='btn btn-default' /> <input type="button" value="Clear Value" class='btn btn-default' ng-click="name='Learn It' ; myName=''" /> </div> </div> <script> var app = angular.module("clickExample", []); app.controller('ExampleController', ['$scope', function ($scope) { $scope.name = 'Learn It'; $scope.setValue = function (myName) { $scope.name = myName; } }]); </script> </body> </html>
Output