Monday, September 21, 2020

Angular Js Slip no.5

 SYBBA(CA)

Angular Js BCA Practical Slips Solution

Slip no.5 Write an AngularJS script for addition of two numbers using ng-init, ng-model & ng-bind. And also Demonstrate ng-show, ng-disabled, ng-click directives on button component.

<!DOCTYPE html>

<html>

<head>

    <script src="C:\angular-1.8.0\angular-1.8.0\angular.js"></script>

</head>

<body  ng-app ng-init="checked=true;check=true" >


  Enter number1: <input type="number" ng-model="n1"><br/>

  <br/>

  Enter number2:<input type="number" ng-model="n2">

  <br/><br/>

  <button ng-click="add=(n1+n2)" ng-init="add=0">result </button><br/><br/>

   addition of two numbers= 

  <span ng-bind="add"></span><br/><br/>

  <label>Click me to make button disabled or enabled: <input type="checkbox" ng-model="checked"></label>

  <button  ng-disabled="checked" >Disable</button><br/><br/>

  <label>Click me to  show or hide button: <input type="checkbox" ng-model="check"></label> 

  <button   ng-show="check">Show</button><br/>


</body>

</html>

BCA Practical Slips

Posted by at No comments:

Friday, September 18, 2020

Angular Js Slip No.4

 SYBBA(CA)

Angular Js BCA Practical Slips Solution

Slip No.4 Write an AngularJS script to print details of bank (bank name, MICR code, IFC code, address etc.) in tabular form using ng-repeat 

 <!DOCTYPE html> 


<html> 

<script src= "C:\angular-1.8.0\angular-1.8.0\angular.js"> 

  </script> 

<style> 

    body { 

        margin: 2%; 

        font-size: 120%; 

    }       

    th, 

   td { 

        padding: 20px; 

    } 

</style> 

<body ng-app="myApp" ng-controller="ListController"> 

    <h1>Bank Details</h1> 

    <table border=1> 

        <thead> 

            <tr> 

                <th>S.No</th> 

                <th>Name</th> 

                <th>MICR Code</th> 

                <th>IFSC Code</th> 

                <th>Address</th> 

            </tr> 

        </thead> 

        <tr ng-repeat="i in bank"> 

            <td> {{i.sno}} </td> 

            <td> {{i.name}} </td> 

            <td> {{i.micr}} </td> 

            <td> {{i.ifsc}} </td> 

            <td> {{i.address}} </td> 

        </tr> 

    </table>   

</body> 

<script> 

    var app = angular.module('myApp', []); 

    app.controller( 

      'ListController', function($scope) { 

        $scope.bank = [{ 

                sno: 1, 

                name: 'SBI', 

                micr: 'sbi123', 

                ifsc: 9876563454, 

                address: "satara", 


            }, { 


                sno: 2, 

                name: 'BOI', 

                micr: 'boi123', 

                ifsc: 7865452396, 

                address: "Pune", 


            }, { 


                sno: 3, 

                name: 'RBI', 

                micr: 'rbi123', 

                ifsc: 7865452316, 

                address: "kolhapur", 


            }, { 


                sno: 4, 

                name: 'BOM', 

                micr: 'bom123', 

                ifsc: 7765458921, 

                address: "goa", 


            }, { 


                sno: 5, 

                name: 'BOB',          

               micr: 'bob123', 

                ifsc: 7765458921, 

                address: "satara", 

            } 

        ]; 

    }); 

</script> 

</html> 

Posted by at No comments:

Thursday, September 17, 2020

Angular Js Slip no 3

 SYBBA(CA)

Angular Js Practical Slips

Slip no 3  Using AngularJS display the 10 student details in Table format 

(using ng-repeat directive use Array to store data)

<!DOCTYPE html> <html> <script src= "C:\angular-1.8.0\angular-1.8.0\angular.js"> </script> <style> body { margin: 2%; font-size: 120%; } th, td { padding: 20px; } </style> <body ng-app="myApp" ng-controller="ListController"> <h1>Student Details</h1> <table border=1> <thead> <tr> <th>S.No</th> <th>Name</th> <th>class</th> <th>phone no </th> <th>address</th> </tr> </thead> <tr ng-repeat="i in student"> <td> {{i.sno}} </td> <td> {{i.name}} </td> <td> {{i.class}} </td> <td> {{i.phno}} </td> <td> {{i.address}} </td> </tr> </table> </body> <script> var app = angular.module('myApp', []); app.controller( 'ListController', function($scope) { $scope.student = [{ sno: 1, name: 'Roger Federer', class: 'FY', phno: 9876563454, address: "satara", }, { sno: 2, name: 'Rafael Nadal', class: 'SY', phno: 7865452396, address: "Pune", }, { sno: 3, name: 'Novak Djokovic', class: 'SY', phno: 7865452316, address: "kolhapur", }, { sno: 4, name: 'Pete Samprass', class: 'FY', phno: 7765458921, address: "goa", }, { sno: 5, name: 'Roy Emerson', class: 'FY', phno: 7765458921, address: "satara", } ];
}); 

</script> 

</html> 
Posted by at No comments:

Wednesday, September 16, 2020

Angular Js Slip no.1

 SYBBA(CA)

Angular Js Practical Slips

Slip no.1 

Write an AngularJS script to display list of games stored in an array on click of button using ng-click. And also  Demonstrate ng-init, ng-bind directive of AngularJS.

<!DOCTYPE html>

<html>

<head>

    <script src="C:\angular-1.8.0\angular-1.8.0\angular.js"></script>


</head>


<body ng-app="myApp">


<div ng-controller="myCtrl" >

    <button ng-click="myFunc()">Display Games</button>

           <ol>

             <li ng-repeat="i in game" ng-bind="i"></li>

           <ol> 

      

</div>


<script>

angular.module('myApp', [])

.controller('myCtrl', ['$scope', function($scope) {

    $scope.count = 0;

    $scope.myFunc = function() {

        $scope.game=['Cricket','vollyball','Basketball'];       

    };

}]);

</script>


</body>

</html>


Posted by at No comments:

Angular JS Slip no .2

 SYBCA 

Angular Js Practical Slips

Slip No.2

Write a HTML code using AngularJS to generate the following output

Undergraduate Courses (hint : use ng-repeat, ng-init directive)

i. BBA(CA)

ii. BCA(Science)

iii. B.Sc.(Computer Science)

 Post Graduate Courses

i. M.Sc.(Computer Science)

ii. M.Sc.(CA)

iii. MCA                      


<!DOCTYPE html>
<html>
<head>
    <script src="C:\angular-1.8.0\angular-1.8.0\angular.js">
   </script>
    <style>
        div {
            border: 1px solid green;
            width: 100%;
            height: 100px;
            display: block;
            margin-bottom: 10px;
            text-align:left;
            background-color:yellow;
        }
    </style>
</head>
<body ng-app ng-init="courses=['BBA(CA)','BCA(Science)',
            'B.Sc(Computer Science)']">
    <h1> Undergraduate Courses </h1>
    <ol type=i>
        <li ng-repeat="name in courses">
            {{name}}
        </li>
    </ol>
    <h1> Post Graduate Courses </h1>
        <div ng-init="postcourses=['MCA','M.Sc(CA)',
          'M.Sc(Computer Science)']">
    <ol type=i>
        <li ng-repeat="name in postcourses ">
            {{name}}
        </li>
    </ol>
    </div>
</body>
</html>
Posted by at No comments:
Subscribe to: Posts (Atom)