<html ng-app="hotelsApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>
<body ng-controller="HotelController">
<h1>Top Hotels in Pune</h1>
<div ng-show="!selectedHotel">
<p>Welcome to the Top Hotels in Pune SPA! Select a hotel to view its details:</p>
<ul>
<li ng-repeat="hotel in hotels">
<a href="" ng-click="selectHotel(hotel)">{{ hotel.name }}</a>
</li>
</ul>
</div>
<div ng-show="selectedHotel">
<h2>{{ selectedHotel.name }} Details</h2>
<p><strong>Address:</strong> {{ selectedHotel.address }}</p>
<p><strong>Contact:</strong> {{ selectedHotel.contact }}</p>
<button ng-click="deselectHotel()">Back</button>
</div>
<script>
var app = angular.module('hotelsApp', []);
app.controller('HotelController', function ($scope) {
$scope.hotels = [
{ name: 'Hotel A', address: '123 Main Street, Pune', contact: 'Phone: 123-456-7890' },
{ name: 'Hotel B', address: '456 Elm Street, Pune', contact: 'Phone: 987-654-3210' }
// Add more hotels as needed
];
$scope.selectHotel = function (hotel) {
$scope.selectedHotel = hotel;
};
$scope.deselectHotel = function () {
$scope.selectedHotel = null;
};
});
</script>
</body>
</html>
No comments:
Post a Comment