javascript - Adding a function to the scope of an Angular custom directive -
i have following angular directive.
// component panel app.directive('component', function () { return { restrict: 'ae', scope: { heading: '@heading', componenttype: '@componenttype' getcomponenturl: function() { var componentpath = "./shell/partials/components/" + componenttype + ".html"; return componentpath; } }, template: '\ <div id="panel" class="panel panel-primary panel-component fill scrollable">\ <div class="panel-heading">\ <div class="row">\ <div class="col-sm-6">\ <h2 class="panel-title">{{heading}}</h2>\ </div>\ <div class="col-sm-6">\ <button type="button" class="btn btn-default pull-right btn-expand" data-toggle="tooltip" data-placement="left" title="go fullscreen" ng-click="">\ <i class="fa fa-expand"></i></button>\ </div>\ </div>\ </div>\ <div class="panel-body fill">\ <!-- include used here different component types may have different attributes\ includes placed here , directives used within includes.\ -->\ <div ng-include="getcomponenturl()"> </div>\ </div>\ </div>\ ', link: function(scope, elm, attrs) { } } });
as can see use following in directive's scope:
getcomponenturl: function() { ... }
this doesn't seem work.
i trying supply ng-include predefined string. appreciate there other ways wondered angular have means of putting methods scope of directive?
many thanks, kiran
try
app.directive('component', function () { return { restrict: 'ae', link : function(scope){ scope.getcomponenturl = function() { var componentpath = "./shell/partials/components/" + componenttype + ".html"; return componentpath; } }, scope: { heading: '@heading', componenttype: '@componenttype' },
Comments
Post a Comment