ng-metadata指令，从指令中的元素获得“html”

我试图用@Directive语法将指令转换为ng-metadata，但我很难找出一个特定的部分。该指令要求element.html()，但我似乎无法弄清楚新指令在哪里。ng-metadata指令，从指令中的元素获得“html”

这是指令;

angular.module('ngContenteditable', ['ngSanitize']). 
    directive('contenteditable', ['$sce','$sanitize', function($sce, $sanitize) { 
     return { 
      restrict: 'A', 
      require: '?ngModel', 
      link: function(scope, element, attrs, ngModel) { 
       if (!ngModel) return; 

       ngModel.$render = function() { 
        element.html($sanitize(ngModel.$viewValue || '')); 
       }; 

       element.on('blur keyup change', function() { 
        scope.$apply(readViewText); 
       }); 

       function readViewText() { 
        var html = element.html(); 
        if (attrs.stripBr && html == '<br>') { 
         html = ''; 
        } 
        ngModel.$setViewValue(html); 
       } 
      } 
     }; 
}]);

到目前为止，这是我对ng元数据版本。

import { Directive, Inject, Self, Optional, Input, HostListener } from 'ng-metadata/core'; 

@Directive({ 
    selector: '[contenteditable]' 
}) 
export class ngDirective { 
    @Input() stripBr: string; 
    constructor(
     @Inject('ngModel') @Self() @Optional() private ngModel: any, 
     @Inject('$sce') private $sce: ng.ISCEService, 
     @Inject('$sanitize') private $sanitize: ng.sanitize.ISanitizeService) { 
    } 

    @HostListener('blur keyup change') 
    onNgChange() { 

    } 

    onReadViewText() { 
     let html = this.html(); // ... how do I get the HTML? 
    } 
}

来源

2017-02-26 Ciel

它可能应该是$ element服务和$ element.html（）。它不特定于ng-metadata。当代码从链接功能移动到控制器并返回时，这是如何完成的。 – estus

但是'$ element'从哪里来？ – Ciel

来自依赖注入。 https://docs.angularjs.org/api/ng/service/$compile#-controller- – estus

一种用于纳克 - 元数据@Directive和@Component类实际上是一个控制器类。和指令控制器具有本地依赖性 - $scope，$element等

$element应注入构造任何其他依赖和喜欢$element.html()使用。

来源

2017-02-26 23:26:59 estus

这很好。非常感谢。我觉得自己像一个白痴，但我是一个有工作代码的白痴！ – Ciel

不客气。 – estus

ng-metadata指令，从指令中的元素获得“html”

回答

相关问题