将函数调用为多个指令的系列

时间:2015-11-20 20:54:21

标签: javascript angularjs angularjs-directive popover

HTML:

dt(class="dd_startup_page")
    span Tags :
        dd(class="dd_startup_page")
            noncompetitionvalue(ng-repeat="object in page_data.tags_data" name-popover="infoPopoverEdit" object="object" object-key="object.value" css-style-value="" name-add-popover="tagAddPopover" css-style-popover="display:inline; position:relative; padding-left:14px")

指令:

 angular.module('StartUpPageController', [x, x, x])
.controller('containerHandler', containerHandler)
.controller('pageControl', pageControl)
.filter('convertNumber', convertNumber)
.directive('noncompetitionvalue', function() {
    return {
        restrict: 'E',
        controller: function($scope, $element){
            var temp = $element.html();
            if ($scope.$parent.$last) {
                var popover = '<span ns-popover="ns-popover" ns-popover-trigger="click" ns-popover-placement="bottom|left" ns-popover-template="'+$scope.nameaddpopover+'" ns-popover-theme="popoverMenu" ns-popover-timeout="-1"><i style="'+$scope.cssstylepopover+'" class="icon-plus"></i></span>';
                var temp = temp.replace('LASTITEM', popover);
            }
            else 
                var temp = temp.replace('LASTITEM', ' <span> | </span> ');
            $element.html(temp)
        },
        scope: {
            namepopover: '@namePopover',
            object: '=object',
            objectkey: '=objectKey',
            stylevalue: '@cssStyleValue',
            nameaddpopover: '@nameAddPopover',
            styleaddopover: '@cssStylePopover'   
        },
        template: '<span ns-popover="ns-popover" ns-popover-trigger="contextmenu" ns-popover-placement="bottom|left" ns-popover-template="{{ namepopover }}" ns-popover-theme="popoverMenu" ns-popover-timeout="-1"><span ng-if="object.rejectedOn"><span style="{{ stylevalue }}" class="rejected">{{ objectkey }}</span></span><span ng-if="!object.rejectedOn"><span style="{{ stylevalue }}">{{objectkey}}</span></span></span> LASTITEM '
    }
});

directibe ns-popover调用此模板:

script(type="text/ng-template" id="infoPopoverEdit").
<!-- START TOOLBAR -->
<div class="toolbar">
    <i class="fa fa-close" ng-click="hidePopover();rightclickEventObject(object, false)" style="float: right;"></i>
    <!-- icon-lock -->
    <div ng-if="!object.locked">
        <i class="icon-lock" ng-click="lockHandlerStartup(true, object); hidePopover();rightclickEventObject(object, false)"></i>
    </div>
    <div ng-if="object.locked">
        <i class="icon-lock iconActive" ng-click="lockHandlerStartup(false, object); hidePopover();rightclickEventObject(object, false)"></i>
    </div>
<div>

我遇到的唯一问题是,我无法在我的popover中使用我的函数......这些函数在我的函数pageControl中定义,定义为控制器。 我将感谢任何能够揭露我可能忽略的方面的人... 提前谢谢。干杯

1 个答案:

答案 0 :(得分:0)

你在这里尝试做什么并不是很清楚,但我想你正在问如何从其他地方调用控制器中定义的函数,比如指令。最简单的方法是将函数作为参数传递给指令并调用它。这是基本的骨架。

<div my-directive passed-in-func="myFunction"></div>

.controller('myController',function($scope) {
    $scope.myFunction = function() {

    };
 }

.directive('myDirective',function() {
  return {
   scope: {
     passedInFunc: '='
   },
   template: "<div ng-click='doCallFunc()'>blah blah</div>",
   link: function(scope,element,attrs) {
       scope.doCallFunc = function() {
          passedInFunc();
       };
   }

  }

});