so i'm learning directives , controllers in jsangular. i'm trying appetizers loop through on menu can't seem output respond. missing here? in advance.
maincontroller.js:
app.controller('maincontroller', ['$scope', function($scope) { $scope.today = new date(); $scope.appetizers = [ { name: 'caprese', description: 'mozzarella, tomatoes, basil, balsmaic glaze.', price: 4.95 }, { name: 'bruschetta', description: 'grilled bread garlic, tomatoes, olive oil.', price: 4.95 }, { name: 'mozzarella sticks', description: 'served marinara sauce.', price: 3.95 } ]; $scope.mains = [ { name: 'roast beef au jus', description: 'delicious amazing sauce', price: 15.99 }, { name: 'prime rib', description: 'just jacoby/s', price: 18.95 }, { name: 'bbq ribs', description: 'better krupa/s', price: 15.99 } ] $scope.extras = [ { name: 'cole slaw', }, { name: 'creamed spinach', }, { name: 'boston baked beans', } ] }]); <!doctype html> <html> <head> <link href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet" /> <link href='https://fonts.googleapis.com/css?family=playfair+display:400,400italic,700italic|oswald' rel='stylesheet' type='text/css'> <link href="css/main.css" rel="stylesheet" /> <script src="js/vendor/angular.min.js"></script> </head> <body ng-app='pizzaplanetapp'> <div class="header"> <h1><span>pizza</span><span>planet</span></h1> </div> <div class="main" ng-controller="maincontroller"> <div class="container"> <h1>specials {{ today | date }}</h1> <h2>appetizers</h2> <div class="appetizers row" ng-repeat="appetizer in appetizers"> <div class="item col-md-9"> <h3 class="name"> {{ appetizer.name }} </h3> <p class="description"> {{ appetizer.description }} </p> </div> <div class="price col-md-3"> <p class="price"> {{ appetizers.price | currency }} </p> </div> </div> </div> </div> <div class="footer"> <pizza-footer></pizza-footer> </div> <!-- modules --> <script src="js/app.js"></script> <!-- controllers --> <script src="js/controllers/maincontroller.js"></script> </body> </html>
you need refer pizzaplanetapp application module first. add following line of code before creating controller.
var app = angular.module("pizzaplanetapp", []); this refers app want create controller of , contains list of modules app depends on.
in case list empty.
Comments
Post a Comment