Scribd Logo
Upload

Welcome to Scribd!

  • 1.full Name Display

    Uploaded by

    Apeksha S kenchareddy
    5 views7 pages

    Original Title

    ajs

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    5 views7 pages

    1.full Name Display

    Uploaded by

    Apeksha S kenchareddy

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 7

    1.

    Full Name Display


    <!DOCTYPE html>
    <html>
    <head>
    <title>AJS</title>
    <script src="angular.min.js"></script>
    <script>
    var app=angular.module("myApp",[])
    app.controller("myCntrl",function($scope){
    $scope.firstName="Apeksha"
    $scope.lastName="S K"
    });
    </script>
    </head>
    <body ng-app="myApp">
    <h2>AJS display full name</h2>
    <div ng-controller="myCntrl">
    enter firstName:<input type="text" ng-model="firstName"></br>
    enter lastName:<input type="text" ng-model="lastName"></br>
    your fullName:{{firstName+" "+lastName}}
    </div>
    </body>
    </html>

    2.Shopping list
    <html>
    <title>AngularJS Shopping List</title>
    <script src="angular.min.js"></script>
    <head>
    <script>
    var app=angular.module('shoppingApp', [])
    app.controller('shoppingCtrl', function ($scope) {
    $scope.shoppingItems = ['Apples', 'Bananas', '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>
    </head>
    <body ng-app="shoppingApp" ng-controller="shoppingCtrl">
    <h2>Shopping List</h2>
    <ul>
    <li ng-repeat="item in shoppingItems">{{ item }}
    <button ng-click="removeItem($index)">Remove</button><br><br>
    </li>
    </ul>
    <input type="text" ng-model="newItem" placeholder="Add a new item">
    <button ng-click="addItem()">Add Item</button>
    </body>
    </html>
    3.Calculator
    <!DOCTYPE html>
    <html>
    <head>
    <title>AJS</title>
    <script src="angular.min.js"></script>
    <script>
    var app=angular.module("calcApp",[])
    app.controller("calcCntrl",function($scope){
    $scope.num1=0
    $scope.num2=0
    $scope.result=0
    $scope.opertator="add"
    $scope.compute=function(){
    switch($scope.operator){
    case 'add':$scope.result=$scope.num1+$scope.num2
    break
    case 'sub':$scope.result=$scope.num1-$scope.num2
    break
    case 'mul':$scope.result=$scope.num1*$scope.num2
    break
    case 'div':if($scope.num2=0){
    alert("divide by zero error")
    }
    else {
    $scope.result=$scope.num1/$scope.num2
    }}}
    });
    </script>
    </head>
    <body ng-app="calcApp">
    <h2>AJS Simple Calculator</h2>
    <div ng-controller="calcCntrl">
    enter first number:<input type="number" ng-model="num1">
    select operator:<select ng-model="operator">
    <option value="add">+</option>
    <option value="sub">-</option>
    <option value="mul">*</option>
    <option value="div">/</option>
    enter second number:<input type="number" ng-model="num2">
    <button ng-click="compute()">compute</button>
    <br/><b>{{num1+""+operator+""+num2+"="+result}}</b>
    </div>
    </body>
    </html>
    4.Factorial and square
    <!DOCTYPE html>
    <html>
    <head>
    <title>AJS</title>
    <script src="angular.min.js"></script>
    <script>
    var app=angular.module("mySqFct",[])
    app.controller("mySqFctCntrl",function($scope){
    $scope.num=0
    $scope.result=0
    $scope.factorial=function(){
    if($scope.num==0)
    {
    $scope.result=1
    }
    else{
    $scope.fact=1
    for(var i=$scope.num;i>=1;i--)
    {
    $scope.fact=$scope.fact*i
    }
    $scope.result=$scope.fact
    }
    }
    $scope.square=function(){
    $scope.result=$scope.num*$scope.num
    }
    });
    </script>
    </head>
    <body ng-app="mySqFct">
    <h2>AJS factorial & square application</h2>
    <div ng-controller="mySqFctCntrl">
    enter the number:<input type="number" ng-model="num">
    <button ng-click="square()">compute square</button>
    <br/>{{result}}
    </div>
    </body>
    </html>

    5.cgpa
    <html>
    <head>
    <title>AngularJS Student Details</title>
    <script src="angular.min.js"></script>
    <script>
    var app = angular.module('studentApp', []);
    app.controller('studentController', function ($scope) {
    $scope.students = [];
    $scope.addStudent = function () {
    if ($scope.name && $scope.cgpa) {
    $scope.students.push({
    name: $scope.name,
    cgpa: $scope.cgpa
    });
    $scope.name = '';
    $scope.cgpa = '';
    }
    };
    });
    </script>
    </head>
    <body ng-app="studentApp" ng-controller="studentController">
    <h2>Student Details</h2>
    Student Name:
    <input type="text" ng-model="name" />
    CGPA:
    <input type="number" ng-model="cgpa" ng-min="1" ng-max="10"/>
    <button ng-click="addStudent()">Add Student</button>
    <p>Total Students: {{ students.length }}</p>
    <ul>
    <li ng-repeat="student in students">
    {{ student.name }} - CGPA: {{ student.cgpa }}
    </li>
    </ul>
    </body>
    </html>
    6.login form
    <html>
    <script src="angular.min.js"></script>
    <script>
    var app = angular.module('loginApp', []);
    app.controller('loginController', function ($scope) {

    $scope.login = function () {
    if ($scope.username == 'ram' && $scope.password == 'ram') {
    alert('Login successful');
    }
    else {
    alert('Login failed. Invalid username or password.');
    }
    };
    });
    </script>
    <body ng-app="loginApp" ng-controller="loginController">
    <h1>Login Form</h1>
    <form ng-submit="login()">
    Username <input type="text" ng-model="username" required><br>
    Password<input type="password" ng-model="password" required><br>
    <button type="submit">Login</button>
    </form>
    </body>
    </html>

    You might also like