I want to write a directive that shows/hides the element based on the role I'm providing as a parameter (string value).
I have the following directive:
(function() {
'use strict';
angular
.module('fuse')
.directive('showWhenRole', showWhenRoleDirective);
/** @ngInject */
function showWhenRoleDirective(auth) {
return {
restrict: 'A',
scope: {
showWhenRole: '@'
},
compile: function(scope, tElement) {
console.log("showWhenRoleDirective",scope.showWhenRole);
// if (auth.isAdmin()) {
// tElement.show();
// } else {
// tElement.hide();
// }
}
};
}
})();
My HTML element looks as follows:
<md-menu-bar id="user-menu" show-when-role="admin">
When I look in the console, the message is:
showWhenRoleDirective undefined
What am I doing wrong?
admina boolean value on your scope or is this a string value you need to check against. I'm assuming it's a string value because you've defined the isolate scope with the@assignment.ng-showorng-hide?compiletolink, scope is not available in compile phase. also check scope/$scopelinkfunction, the $scope is not available in the compile phase.