@model AngularJs02.Person
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<style type="text/stylesheet">
<div ng-controller="MyController">
<div class="page-header">AngularJS Code Examples</div>
<div class="well well-sm" class="well well-sm">
<h3>Angular Rendering <small>double braces, { { value } }</small></h3> <span>{{myData.text}}</span> <div class="well well-sm">
<h3>Angular Optional <small><b>ng-show</b> and <b>ng-hide</b></small></h3>
<span ng-show="myData.showIt">s</span>
<span ng-hide="myData.showIt">h</span>
<div class="well well-sm">
<h3>Angular Rendering <small><b>ng-bind</b> binding to function</small></h3>
<span ng-bind="myData.fnText()"></span>
<div ng-controller="MyController" class="well well-sm">
<h3>Angular Conditionals <small><b>ng-switch</b> and <b>ng-if</b></h3>
<div ng-switch on="myData.switch">
<div ng-switch-when="1">Shown when switch is 1</div>
<div ng-switch-when="2">Shown when switch is 2</div>
<div ng-switch-default>Shown when switch is anything else than 1 and 2</div>
<div ng-if="myData.showItIf">ng-if Sow it</div>
<div class="well well-sm">
<h3>Angular repeat <small>ng-small</small></h3>
<li ng-repeat="fruit in myData.fruits" >
<span class="label label-sm label-primary">{{fruit.name}}</span> <div class="well well-sm">
<h3>Angular Filter: <small>| Filter: itemFilter</small></h3>
<li ng-repeat="student in myData.students" >
<span class="label label-sm label-primary">{{student.name}}</span> <li ng-repeat="student in myData.students | filter: myData.isDistinction" >
<span class="label label-sm label-success">{{student.name}}</span> <span class="btn btn-default" ng-click="myData.clicked()">Start</span>
angular.module("myApp",[]) .controller("MyController", function($scope){ $scope.myData.text = "test data";
$scope.myData.fnText = function() { return "A text from a function"; }; $scope.myData.showIt=true;
$scope.myData.clicked = function(){alert("clicked");} $scope.myData.showIt = true;
$scope.myData.fruits=[{name:"orange"},{name:"apple"},{name:"banana"}]; $scope.myData.students = [{name:"John",grade:80},{name:"Rose",grade:45},{name:"Mathew",grade:90}]; $scope.myData.isDistinction = function(student)
