1.)<html ng-app="nameApp"> - <head> - <title>AngularJS Full Name Example</title> 2.
) <html ng-app="shoppingApp"> - <head> - <title>AngularJS Shopping List</title> -
- <script> - <script -
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js"></script> src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js"></script>
- </head> - <body> - <div ng-controller="nameCtrl"> - First Name: - <input </head> - <body ng-controller="shoppingCtrl"> - <h2>Shopping List</h2> -
type="text" ng-model="firstName" placeholder="Enter your first name"> - <br> <ul> - <li ng-repeat="item in shoppingItems">{{ item }} - <button ng-
<br> - Last Name: - <input type="text" ng-model="lastName" placeholder="Enter your last click="removeItem($index)">Remove</button> - </li> - </ul> --> - <table> -
name"> - <br> <br> - <button ng-click="displayFullName()">Display Full Name</button> - <tr ng-repeat="item in shoppingItems"> - <td>{{ item }}</td> - <td><button ng-
<h1>Full Name is: {{ fullName }}</h1> - </div> - <script> - click="removeItem($index)">Remove</button></td> - </tr> - </table> - <input
angular.module('nameApp', []) - .controller('nameCtrl', function ($scope) { - type="text" ng-model="newItem" placeholder="Add a new item"> - <button ng-
$scope.firstName = 'Raj'; - $scope.lastName = 'Kumar'; - $scope.displayFullName = function () { click="addItem()">Add Item</button> - <script> - angular.module('shoppingApp', [])
- $scope.fullName = $scope.firstName + ' ' + $scope.lastName; - - .controller('shoppingCtrl', function ($scope) { - $scope.shoppingItems = ['Apples', 'Bananas',
}; - }); - </script> - </body> - </html>. 'Bread', 'Milk']; - $scope.addItem = function () { - if ($scope.newItem) { -
$scope.shoppingItems.push($scope.newItem); - $scope.newItem = ''; - } - }; -
$scope.removeItem = function (index) { - $scope.shoppingItems.splice(index, 1); -
}; - }); - </script> - </body> - </html>.
3). <html ng-app="calculatorApp"> - <head> - <title>AngularJS Calculator</title> - 4.) <html ng-app="mathApp"> - <head> - <title>AngularJS Math Operations</title> -
<script - <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"> -
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script> </script> - </head> - <body ng-controller="mathController"> - <h2>Math Operations</h2> - Enter
- </head> - <body ng-controller="calculatorController"> - <h2>Simple a Number: - <input type="number" ng-
Calculator</h2> - Enter Number 1: - <input type="number" ng-model="num1" /> - Select model="inputNumber" /> - <button ng-click="calculateFactorial()">Calculate
Operator: - <select ng-model="operator"> - <option value="+">Add</option> - <option value="- Factorial</button> - <button ng-click="calculateSquare()">Calculate
">Subtract</option> - <option value="*">Multiply</option> - <option value="/">Divide</option> - Square</button> - <p ng-show="factorialResult !== undefined">Factorial: {{ factorialResult }}</p>
</select> - Enter Number 2: - <input type="number" ng-model="num2" /> - - <p ng-show="squareResult !== undefined">Square: {{squareResult }}</p> - <script> - var app =
<button ng-click="calculate()">Calculate</button> - <p ng-show="result !==undefined">Result: {{ angular.module('mathApp', []); -
result }}</p> - <script> - var app = angular.module('calculatorApp', []); - app.controller('mathController', function ($scope) { - $scope.calculateFactorial =function ()
app.controller('calculatorController', function ($scope) { - $scope.calculate = function () { - switch { - if ($scope.inputNumber >= 0) { - $scope.factorialResult =
($scope.operator) { - case '+': - $scope.result = $scope.num1 + $scope.num2; - break; - case '-': - factorial($scope.inputNumber); - } else { - $scope.factorialResult = 'Cannot calculate factorial for
$scope.result = $scope.num1 - $scope.num2; - break; - case '*': - $scope.result = negative numbers'; - } - }; - $scope.calculateSquare = function () { -
$scope.num1 * $scope.num2; - break; - case '/': - if ($scope.num2 !== 0) { - $scope.squareResult = $scope.inputNumber * $scope.inputNumber; -
$scope.result = $scope.num1 / $scope.num2; - } else { - $scope.result = 'Cannot }; - function factorial(n) { - if (n == 0 || n == 1) { - return 1; - } else { - return n * factorial(n - 1); - } - }
divide by zero'; - } - break; - } - }; - }); - </script> - </body> - </html>. - }); - </script> - </body> - </html>.
5.) <html ng-app="studentApp"> - <head> - <title>AngularJS Student Details</title> - 6.)<!DOCTYPE html> - <html ng-app="todoApp"> - <head> - <title>AngularJS TodoList</title> -
<script <script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script> src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"> -
- </head> - <body ng-controller="studentController"> - <h2>Student Details</h2> - </script> - </head> - <body ng-controller="todoController"> -
Student Name: - <input type="text" ng-model="name" /> - CGPA: - <input <h1>Todo List</h1> - <form ng-submit="addTask()"> - Task: - <input type="text" ng-
type="number" ng-model="cgpa" ng-min="1" ng-max="10"/> - <button ng- model="newTask" required> - <button type="submit">Add Task</button> - </form>
click="addStudent()">Add Student</button> - <p>Total Students: {{ students.length - <br> - <table> - <thead> - <tr> - <th>Task</th> - <th>Action</th> - </tr> - </thead>
}}</p> - <ul> - <li ng-repeat="student in students"> - {{ student.name }} - CGPA: {{ - <tbody> - <tr ng-repeat="task in tasks"> - <td>{{ task }}</td> - <td> - <button ng-
student.cgpa }} - </li> - </ul> - <script> - var app = angular.module('studentApp', []); - click="editTask($index)">Edit</button> - <button ng-
app.controller('studentController', function ($scope) { - $scope.students = []; - click="deleteTask($index)">Delete</button> - </td> - </tr> - </tbody> -
$scope.addStudent = function () { - if ($scope.name && $scope.cgpa) { - </table> - <div ng-if="editingTaskIndex !== null"> - <h2>Edit Task</h2> -Task: - <input type="text"
$scope.students.push({ - name: $scope.name,cgpa: $scope.cgpa - }); - $scope.name =''; - ng-model="tasks[editingTaskIndex]" required> - <br> -<button ng
$scope.cgpa = ''; - } - }; - }); - </script> - </body> - </html>. click="saveEdit()">Save</button> - <button ng- click="cancelEdit()">Cancel</button> - </div> -
<script> - var app =angular.module('todoApp', []); -app.controller('todoController', function
($scope) { - $scope.tasks = ['Task 1', 'Task 2', 'Task 3']; - $scope.newTask = ''; -
(OPTIONAL VERSION CODES ) $scope.editingTaskIndex = null; - $scope.addTask = function () { -
(No Need to write Only for Execution Purpose) 1) $scope.tasks.push($scope.newTask); - $scope.newTask = ''; - }; - $scope.editTask = function
1.8.0 (index) {- $scope.editingTaskIndex = index; - }; - $scope.saveEdit =
2) 1.8.2 function () { - $scope.editingTaskIndex = null; - }; - $scope.cancelEdit = function () { -
3) 1.7.8 $scope.editingTaskIndex = null; - }; - $scope.deleteTask = function (index) { -
4) 1.6.9 $scope.tasks.splice(index, 1); - }; - }); - </script> - </body> - </html>.
