Below are the configurations for my application:
angular.module('myApp', ['myApp.directives', 'myApp.controllers', 'myApp.services']);
Here is the controller I am using:
angular.module('myApp.controllers', [])
.controller('MainCtrl', function ($scope) {
$scope.name = 'world';
});
This is the directive in my app:
var directives = angular.module('myApp.directives', []);
directives.directive("hello", function () {
return function (scope, elm, attrs) {
elm.text("hello, " + scope[attrs.name]);
};
});
and here is how it is implemented in my HTML:
<div ng-controller="MainCtrl">
<h1 hello></h1>
</div>
The issue I am facing is that AngularJS is rendering the directive as:
hello, undefined
Instead of displaying:
hello, world
Can anyone help me figure out what's wrong?