Wednesday, September 10, 2014

AngularJS: Getting Started

HTML File code:

<!doctype html>
<html ng-app="appModule">
<head>
    <title>My Angular App</title>
    <script src="JS\app.js"></script>

</head>
<body ng-controller="appController">
<div>
    Search : <input ng-model="query">
</div>
<div>
    <select ng-model="orderPro">
        <option value="name">Alphabetical</option>
        <option value="age">Newest</option>
    </select>
</div>
<ul>
    <li ng-repeat="phone in phones | filter:query | orderBy:orderPro">
        {{phone.name}}
        <p>
            {{phone.snippet}}
        </p>
    </li>
</ul>
</body>
</html>


JS File Code :


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

appModule.controller('appController',function($scope){

$scope.phones = [
    {'name':'iPhone','snippet':'Good Phone','age':1 },
    {'name':'Windows','snippet':'Above Average Phone','age':3 },
    {'name':'Android','snippet':'Average Phone','age':2 }
];
    $scope.orderPro = 'age';

});

No comments:

Post a Comment