<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<script>
var app = angular.module('logApp', []);
app.controller('LogCtrl', function($scope, $log) {
$scope.$log = $log;
$scope.sms = 'Hi, this is $log!';
});
</script>
</head>
<body ng-app="logApp">
<div ng-controller="LogCtrl">
<h1>Use of $log functions in angularjs</h1>
<label>SMS:
<input type="text" ng-model="sms" />
</label>
<button ng-click="$log.log(sms)">log</button>
<button ng-click="$log.warn(sms)">warn</button>
<button ng-click="$log.info(sms)">info</button>
<button ng-click="$log.error(sms)">error</button>
<button ng-click="$log.debug(sms)">debug</button>
<h4>
RESULT : Reload this page and open console window and click on buttons and see the log results...
</h4>
</div>
</body>
</html>
// Code goes here
/* Styles go here */