Angular Fun

by srmor

HTML

<div ng-app>
  <h2>Menu Chooser</h2>
  <div ng-controller="MenuCtrl">
    <ul class="unstyled">
      <li ng-repeat="menuitem in items">
        <span>{{menuitem.name}}</span>
        <span>
      </li>
    </ul>
    <form ng-submit="generateMenu()">
      <input class="btn-primary" type="submit" value="Get my menu">
    </form>
  </div>
</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
<style>

JavaScript

function MenuCtrl($scope) {
  $scope.items = [];

  $scope.generateMenu = function() {
    
    $scope.items.push({name:$scope.itemName, description:$scope.itemDescription});
    $scope.todoText = '';
  };
}