пользовательские директивы в angularjs

Мой таможенной директивы не работает:пользовательские директивы в angularjs

HTML:

<body ng-controller="StoreController as store"> 
<ul class="list-group"> 
    <li class="list-group-item" ng-repeat="product in store.products"> 

<div> 
     <h3> 
     <product-title></product-title> 
     </h3>

...

javascript.app:

...

app.directive('productTitle', function(){ 
    return { 
     restrice: 'E', 
     templateUrl: 'product-title.html' 
    }; 
});

...

и мой продукт-title.html:

{{product.name}} 
<em class="pull-right"> {{product.price | currency}}</em>

в моем HTML страницы я не могу видеть название продукта и цену продукта.

Я новый в этой теме :) Что мне делать, чтобы заставить его работать? , пожалуйста, помогите мне.

++ спасибо всем за ваши ответы, это работает! я пробовал в течение 3 дней, чтобы найти ответ .. и вы сделали это через 5 минут .. спасибо! :) ++

источник

2016-04-28 Adi

Пожалуйста, ваши полный код для определения приложений, а также ваши директивы. Кроме того, какие ошибки отображаются в консоли JavaScript (F12)? –

Я предполагаю, что ошибка будет в вашем контроллере магазина, пожалуйста, разместите исходный код для него. – RobbyD

Его ограничение не ограничено (проверьте орфографию.) И ошибка может быть в контроллере, как указано в приведенных выше комментариях – Rakeschand

Пара вопросов:

ограничение пишется неправильно
шаблоны для HTML должны иметь один корень, так что вы должны сделать что-то вроде этого

<div> {{product.name}} <em class="pull-right"> {{product.price | currency}}</em> </div>

источник

2016-04-28 13:54:09 mkalish

Полный код программы для вашей директивы JSBin

angular 
    .module('app', []) 
    .controller('AppController', function ($scope) { 
    $scope.store = { 
     products: [ 
     { id: 1, price: 132, name: 'abc' }, 
     { id: 2, price: 127, name: 'def' }, 
     { id: 3, price: 112, name: 'mno' }, 
     { id: 4, price: 145, name: 'xyz' } 
     ] 
    }; 
    }) 
    .directive('productTitle', function(){ 
    return { 
     restrict: 'E', 
     templateUrl: 'product-title.html' 
    }; 
    });

HTML

<div ng-controller='AppController'> 
    <ul class="list-group"> 
    <li class="list-group-item" ng-repeat="product in store.products"> 
     <h3> 
     <product-title></product-title> 
     </h3> 
    </li> 
</ul> 

</div> 

<script id="product-title.html" type="text/ng-template"> 
    {{product.name}} 
    <em class="pull-right"> {{product.price | currency}}</em> 
</script>

источник

2016-04-28 13:59:44

omg it произведение !!!! Спасибо большое!! :) – Adi

Пожалуйста, примите/отпустите его, если он работает для вашей проблемы :) –

пользовательские директивы в angularjs

ответ

Смежные вопросы