Question

有些人，请告诉我如何从typedScript控制器访问javascript指令链接函数。我在指令外有一个按钮，当我单击用户按钮时，我想在pageController中调用该函数。我已经尝试了一些教程，但是我无法使用。

1-这是thdirect.js文件的摘录我想从控制器中调用该函数 Directive.js-JavaScript （函数（）{

    'use strict';

    angular.module('pdf', []).directive('ngPdf', ['$window', function ($window) {
        return {
            restrict: 'E',
            templateUrl: function (element, attr) {
                return attr.templateUrl ? attr.templateUrl : 'app/_infrastructure/pdfViewer/viewer.html';
            },
            scope: {
                pdfUrl: '='

            },
            link: function (scope, element, attrs) {
                var url = scope.pdfUrl;
                scope.goPrevious = function () {
                    if (scope.pageToDisplay <= 1) {
                        return;
                    }
                    scope.pageToDisplay = parseInt(scope.pageToDisplay) - 1;
                    scope.pageNum = scope.pageToDisplay;
                };

            }
        };
    }]);
})();

2-这是指令模板（.hmtl）

<nav class="text-center">
    <div class="prev-next-button previous">
        <button class="btn btn-danger btn-sm" ng-click="goPrevious()">
            <i class="fa fa-arrow-left fa-lg"></i>
        </button>
    </div>
    <div class="prev-next-button next">
        <button class="btn btn-danger btn-sm" ng-click="goNext()">
            <i class="fa fa-arrow-right fa-lg"></i>
        </button>
    </div>



    <span>Pág: </span>
    <input type="text" class="searchPageNumber" min="1" ng-model="pageNum">/
    <span>{{pageCount}}</span>



    <button class="btn btn-danger btn-sm" title="Diminuir" ng-click="zoomOut()">
        <i class="fa fa-minus"></i>
    </button>

    <button class="btn btn-danger btn-sm" ng-click="fit()">
        100%
    </button>


    <button class="btn btn-danger btn-sm" title="Aumentar" ng-click="zoomIn()">
        <i class="fa fa-plus"></i>
    </button>

</nav>
<hr style="border-top: 0px; margin-bottom: 0px!important;margin-top: 1px!important" />

<div style="max-height:900px;max-width:1051px;overflow: auto;">
    <canvas id="pdf" style="border:2px solid #000000;"></canvas>
</div>

3-这是用户页面（.html）

<div class="main-content-inner" ng-controller="MyController as Ctrl">
    <div class="col-xs-8" >
        <div class="form-group" ng-show="(Ctrl.currentProcesso.estadoProcessoId==1 || Ctrl.currentProcesso.estadoProcessoId== 3 ||Ctrl.currentProcesso.estadoProcessoId==6) && Ctrl.appUserBasicInfo.role == 'Escrivão'">
            <ng-pdf data-pdf-url="file.pdf" canvasid="pdf" scale="page-fit" page="1"></ng-pdf>
        </div>
    </div>

    <div class="col-xs-3">
     <button class="btn btn-success btn-sm btn-next"
             ng-click="Ctrl.controllerMethodToCallDirectiveFunction()"
             ng-show="true">
         NEXT
         <i class="tcicons-icon fa fa-arrow-right icon-on-right"></i>
     </button>
    </div>

</div>

4-最后，这是我的控制器（MyController.ts）

public enumerarProcessoPushPop = (): boolean => {
      //I want to call the directive method here
      return true;
  }

Answer 1

Angular指令内的方法并不意味着被称为。来自Angularjs documentation：

从高层次来看，伪指令是DOM元素（例如属性，元素
告诉AngularJS的HTML编译器（$ compile）将指定的行为附加到该DOM元素（例如，通过事件侦听器），甚至转换DOM元素及其子元素。

如何从打字稿控制器l

1 个答案: