facing problems with my directive that I've created. The directive seems to be executing, I know this as console.log() was called and some of the template was shown too however the part which didn't show up was the one with angular expression. Here's a sample:
my index.html:
<!DOCTYPE html> <html ng-app="appModule" ng-controller="controller"> <head> <title>this is the title</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> </head> <body> <ul> <li>{{section.item1}}</li> <li>{{section.item2}}</li> <li>{{section.item3}}</li> </ul> <div ng-repeat='product in section.products_section.list_products'> <directive data='product'></directive> </div> </body> <script src="angularjs/app.js"></script> </html> my app.js:
angular.module('appModule', []).controller('controller', ['$scope', function($scope) { $scope.section = { item1: 'this is item1', item2: 'this is item2', item3: 'this is item3', products_section: { list_products: [ { product_name: 'name 1' }, { product_name: 'name 2' }, { product_name: 'name 3' } ] //end of list_products } }; }]).directive('directive', [function() { return { restrict: 'E', scope: { date: '=' }, templateUrl: 'angularjs/template.html', replace: true, controller: function($scope) { console.log('this is controller in directive is called'); } }; }]); my template html:
<ul> <li>{{product.product_name}}</li> <li>this-is-to-show-this-is-being-executed</li> </ul> firefox console: this is controller in directive is called
what it appears like in browser:
this is item1 this is item2 this is item3 this-is-to-show-this-is-being-executed this-is-to-show-this-is-being-executed this-is-to-show-this-is-being-executed SORRY, Stackoverflow says that I need at least 10 rep to post images.
