Angular: Empty Fiddle

http://angularjs.org/

by heavyhorse

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
  <div ng-controller="MyCtrl">
    <input type="text" ng-model="newMessage">
    <button ng-click="addMessage(newMessage)">
    Add
    </button>
    <ul>
      <li ng-repeat="message in messages">
        {{message}}
        <button ng-click="remove(message, $index)">remove</button>
        <button ng-click="uppercase(message, $index)">uppercase</button>
        <button ng-click="lowercase(message, $index)">lowercase</button>
      </li>
    </ul>
  </div>

JavaScript

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

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
  $scope.newMessage = '';
  $scope.messages = ['first', 'second', 'third'];
  $scope.addMessage = function(msg) {
    $scope.messages.push(msg);
  };
  $scope.remove = function(msg, index) {
    $scope.messages.splice(index, 1);
  };
  $scope.uppercase = function(msg, index) {
    $scope.messages[index] = msg.toUpperCase();
  };
  $scope.lowercase = function(msg, index) {
    $scope.messages[index] = msg.toLowerCase();
  };
}