AngularJS Custom Directives


Hello, I just tried to do the AngularJS Custom directive exercise, that with app store. My code is that:

app.controller('MainController', ['$scope', function($scope) {
 $scope.move = {
 icon: 'img/move.jpg',
 title: 'MOVE',
 developer: 'MOVE, Inc.',
 price: 0.99


$scope.shutterbugg = {
icon: 'img/shutterbugg.jpg',
title: 'Shutterbugg',
developer: 'Chico Dusty',
price: 2.99

$scope.gameboard = {
icon: 'img/gameboard.jpg',
title: 'Gameboard',
developer: 'Armando P.',
price: 1.99

<!doctype html>

<!-- Include the AngularJS library -->
<script src="//"></script>

App Market

<div class="main" ng-controller="MainController">
  <div class="container">
     <div class="card">
       <app-info info="move">
         <img class="icon" ng-src="{{ move.icon }}">
         <h2 class="title">{{ move.title }}</h2>
         <p class="developer">{{ move.developer }}</p>
         <p class="price">{{ move.price | currency }}</p>

    <div class="card">
      <app-info info="shutterbugg">
         <img class="icon" ng-src="{{ shutterbugg.icon }}">
         <h2 class="title">{{ shutterbugg.title }}</h2>
         <p class="developer">{{ shutterbugg.developer }}</p>
         <p class="price">{{ shutterbugg.price | currency }}</p>

    <div class="card">
      <app-info info="gameboard">
         <img class="icon" ng-src="{{ gameboard.icon }}">
         <h2 class="title">{{ gameboard.title }}</h2>
         <p class="developer">{{ gameboard.developer }}</p>
         <p class="price">{{ gameboard.price | currency }}</p>

<!-- Modules -->
<script src="js/app.js"></script>

<!-- Controllers -->
<script src="js/controllers/MainController.js"></script>

<!-- Directives -->
<script src="js/directives/appInfo.js"></script>


app.directive('appInfo', function(){
restrict: 'E',
scope: {
info: '='
templateUrl: 'js/directives/appInfo.html'


So what problems are you running into? What isn't working or doesn't work correctly?