Question

我试图在 TypeScript 中编写带限制C的指令，但链接未被调用。我错过了什么？

/// <reference path="../../../typings/jquery.tooltipster/jquery.tooltipster.d.ts" />
/// <reference path="../../../typings/angularjs/angular.d.ts" />
/// <reference path="../stationstaff.ts" />

module App.StationStaff {

    class BedDetailDirective implements ng.IDirective {

        public static factory() {
            var directive = () => new BedDetailDirective();
            directive.$inject = [];

            return directive;
        }

        public restrict = "C";

        public link($scope: ng.IScope, element: JQuery, attributes: ng.IAttributes) {
            var $element = $(element);
            var content = "<div class='tooltipster-header'><span>Art: Elektrisch</span></div><div class='tooltipster-body'><span>ID: BSHR1114</span><span>Ort: Station SR.1 - Raum: 10</span><span>Hersteller: Hill-Rom</span><span>Nächster Service: 31.05.2015</span></div>";

            $element.tooltipster({
                content: content,
                contentAsHTML: true,
                animation: "fade",
                theme: "hpm-tooltipster",
                position: "right",
                trigger: "click",
                functionReady(e) {
                    e.addClass("hpm-item-active");
                },
                functionAfter(e) {
                    e.removeClass("hpm-item-active");
                }
            });
        }
    }

    angular.module("appStationStaff", [])
        .directive("tooltip", BedDetailDirective.factory());
}



<ion-view ng-controller="bedFinderResultController as vm">
    <ion-content>
        <div class="list">
            <div class="item item-balanced item-icon-right item-royal hpm-item-medium" ng-repeat="bed in vm.beds">
                <div class="hpm-item-icon text-center ion-ios-information-outline tooltip">
                </div>
                <div class="hpm-bed-availability-red"></div> <!-- TODO: Color should come from controller -->
                <div class="row">
                    <div class="col">
                        <div class="row">
                            <div class="hpm-item-title">
                                <span>Type: {{bed.type}}</span>
                            </div>
                        </div>
                        <div class="row">
                            <div class="hpm-item-subtitle">
                                <span>{{bed.location}} - Room: {{bed.room}}</span>
                            </div>
                        </div>
                    </div>
                    <div class="col">
                        <div class="row">
                            <i class="icon ion-ios-arrow-right"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </ion-content>
</ion-view>

Answer 1

问题是在工厂中设置指令：

 public static factory() {
   var directive = () => new BedDetailDirective();
   directive.$inject = [];
   return directive(); // NOTE: calling the function
 }

注册的指令定义是一个返回对象的函数，该对象是指令定义对象（DDO）。

上面返回的是一个返回返回DDO的函数的函数。只需进行更改即可返回该函数的执行而不是函数本身。

角度指令限制＆＃39; C＆＃39;不工作

1 个答案: