<!DOCTYPE html>
<html ng-app="TestApp">
<head>
<script data-require="angular.js@1.3.0-beta.5" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
<script data-require="underscore.js@1.6.0" data-semver="1.6.0" src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller="TestController">
<h1>Hello Plunker!</h1>
<div>{{aString | capitalizeString}}</div>
<div>{{number | addUniqueIdToNumber}}</div>
</body>
</html>
// Code goes here
angular.module("TestApp", [])
.controller("TestController", ["$scope", function($scope){
$scope.aString = "elephant";
$scope.number = 5;
}])
//GOOD FILTER
.filter("capitalizeString", function(){
return function(aString){
return aString.toUpperCase();
}
})
//BAD FILTER
.filter("addUniqueIdToNumber", function(){
return function(number){
number += Math.random();
return number;
}
})
//MEMOIZED BAD FILTER -- NOW IT IS GOOD (THOUGH STILL STUPID)
.filter("addUniqueIdToNumberMemoized", function(){
return _.memoize(function(number){
number += Math.random();
return number;
})
})
/* Styles go here */