Header Ads Widget

BCA Information

Angular js slip30

 <html>

<head>

<script src = " https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">

</script>

<script src = " https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js">

</script>

</head>

  <h1 style="background-color:red" align="center">Welcome To MEESHO</H1>

<div ng-view></div>

 <body>

 <div ng-app = "mainApp">

<p><a href ="#mens">Means Wear</a></p>

<p><a href ="#mobile"> Mobile Accessiries</a></p>

<p><a href="#foot">Foot Wear</a></p>

<p><a href="#ladies">Ladies Wear</a></p>

<div ng-view></div>

<script type ="text/ng-template" id ="men.html">

<marquee><h1 style="background-color:powderblue;"> Welcome to Mens Ware</h1></marquee>

<marquee><img src="C:\Users\BBACA01\Desktop\angulrjs\mend wear.jpg"/>

<h2>T-Shirts</h2>

<h2>Formal Shirts</h2>

<h2>Jeans</h2>

{{message}}

</script>

<script type ="text/ng-template" id ="mob.html">

<marquee><h1 style="background-color:blue;"> Welcome to Mobile Accessories</h1></marquee>

<marquee><img src="C:\Users\BBACA01\Desktop\angulrjs\mobile.jpg"/>

<h2>Mobiles</h2>

<h2>Mobile Covers</h2>

<h2>Headphones</h2>

{{message}}

</script>

<script type ="text/ng-template" id ="foot.html">

<marquee><h1 style="background-color:blue;"> Welcome to Foot Wear</h1></marquee>

<marquee><img src="C:\Users\BBACA01\Desktop\angulrjs\foot.jpg"/>

<h2>Sandels</h2>

<h2>Shoes</h2>

<h2>Chapple</h2>

{{message}}

</script>

<script type ="text/ng-template" id ="ladies.html">

<marquee><h1 style="background-color:blue;"> Welcome to Ladies Wear</h1></marquee>

<marquee><img src="C:\Users\BBACA01\Desktop\angulrjs\ladies.jpg"/>

<h2>Saries</h2>

<h2>Top</h2>

<h2>Lehanga</h2>

{{message}}

</script>

   <script>

var mainApp = angular.module("mainApp", ['ngRoute']);

mainApp.config(['$routeProvider', function($routeProvider)

 {

$routeProvider

.when('/mens', {

templateUrl: 'men.html',controller: 'ctrlmen;'

  })

.when('/mobile', {

templateUrl: 'mob.html',controller: 'ctrlmob'

  })

.when('/foot', {

templateUrl: 'foot.html',controller: 'ctrlfoot'

  })

.when('/ladies', {

templateUrl: 'ladies.html',controller: 'ctrlladies'

  })

 }]);

mainApp.controller('ctrlmen', function($scope)

{

$scope.message = "Welcome  to Means wear";

         });

mainApp.controller('ctrlmob', function($scope)

{

$scope.message = "Welcome  to mobile";

         });

mainApp.controller('ctrlfoot', function($scope)

{

$scope.message = "Welcome  to foot wear";

         });

mainApp.controller('ctrlladies', function($scope)

{

$scope.message = "Welcome  to ladies wear";

         });

             </script>

     

</body>

</html>

Post a Comment

0 Comments

Popular Posts

Visual Basic 6.0 Program
Node js practical