значения не отображаются с помощью угловой директивы

0

Я пытаюсь добавить директиву в угловое и использовать ее для отображения значений. Однако значения не отображаются.

Мой html-код

<!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 for {{ today | date }}</h1>

        <h2>Appetizers</h2>
        <div  ng-repeat="appetizer in appetizers">
          <div class="item col-md-9">
              <pizza-info info=appetizer> </pizza-info>
        </div>


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

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

       <!--directives-->
     <script src="js/directives/pizzaInfo.js"></script>
  </body>
</html>

контроллер

app.controller('MainController', ['$scope', function($scope) {
  $scope.today = new Date();

  $scope.appetizers = [
    {
      name: 'Caprese',
      description: 'Mozzarella, tomatoes, basil, balsmaic glaze.',
      price: 4.95
    },
    {
      name: 'Mozzarella Sticks',
      description: 'Served with marinara sauce.',
      price: 3.95
    },
    {
      name: 'Bruschetta',
      description: 'Grilled bread garlic, tomatoes, olive oil.',
      price: 4.95
    }

  ];
}]);

Директива (pizzaInfo.js)

app.directive('pizzaInfo', function(){
    return {
        restirct:'E',
        scope:{ 
            info:'='
        },
        templateUrl: 'js/directives/pizzaInfo.html'

    };
});

Директива html (pizzaInfo.html)

 <h3 >{{info.name}} </h3>
 <p > {{info.description}}</p>
 <p >{{info.price | currency}} </p>

Я не получаю никаких ошибок в console.log. Что мне здесь не хватает?

Теги:
angularjs-directive

1 ответ

1
Лучший ответ
Syntax Error :))

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

    };
 });
  • 0
    в чем здесь была синтаксическая ошибка?
  • 0
    Вы написали "Restirct". Правильное написание "ограничить".
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню