<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Hello Plunker!</h1>
    <div class="section" ng-app="phonecatApp" ng-controller="PhoneListCtrl">
            <div class="slide" >
                <div class="container">
                    <h2 class="section-title">Selected Mobiles</h2>
                </div>
                <div class="container-fluid fix ver2">
                    <div class="col-md-3 work-thumb" ng-repeat="phone in phones">
                        <a href="#" ng-click="setCount($index)">
                            {{phone.name}}
                        </a>
                    </div>
                </div>
            </div>
    <p>Count: {{count}}</p>
</div>
  </body>

</html>
// Code goes here

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

phonecatApp.controller('PhoneListCtrl', function ($scope) {
    //for defining default value to count
    //$scope.count = 0;
    $scope.setCount = function(index) {
        $scope.count = index;
    } ;
    $scope.phones = [
    {'name': 'Nexus S',
     'snippet': 'Fast just got faster with Nexus S.'},
    {'name': 'Motorola XOOMâ„¢ with Wi-Fi',
     'snippet': 'The Next, Next Generation tablet.'},
    {'name': 'MOTOROLA XOOMâ„¢',
     'snippet': 'The Next, Next Generation tablet.'}
  ];
    
    
});
/* Styles go here */