【问题标题】:Typescript Call method from constructor of the class来自类的构造函数的打字稿调用方法
【发布时间】:2016-04-08 09:21:39
【问题描述】:

我正在尝试像这样调用类构造函数的方法:

' var paddleCtrl = scope.paddleRanged;

        paddleCtrl.slider = slider;
        this.$paddleLeft = paddleCtrl.$paddleLeft = $(elem).find('.paddle-left'),
            this.$paddleRight = paddleCtrl.$paddleRight =  $(elem).find('.paddle-right'),
            this.$paddleRailActive = paddleCtrl.$paddleRailActive = $(elem).find('.paddle-rail .active'),
            this.$clickZone = paddleCtrl.$clickZone =  $(elem).find('.clickZone');

        this.paramsInit();
}'

方法声明如下:
paramsInit() { console.log(this) }

但是得到这个错误:“this.paramsInit 不是一个函数”。我试图声明一个类似的方法:

paramsInit = () => {
        console.log(this)
 }

但是如果方法调用,那么this指的是Window对象

CodePen 上的示例

【问题讨论】:

    标签: javascript angularjs oop typescript angular-directive


    【解决方案1】:

    通过使用关键字“new”分配函数“link”来解决问题。

    例如:

    console.clear();
    class TestController{
      constructor(){
    
      }
    }
    class TestLink {
      constructor(scope, elem, attr, ctrl){
        console.log('Method call:')
        this.method();
        console.log('Method2 call:')
        this.method2();
        console.log('Method3 call:')
        this.method3();
      }
      method = () => {
        console.log(this);
      }
      method2 = function() {
        console.log(this);
      }
      method3() {
        console.log(this);
      }
    
    }
    class TestDirective {
      restrict='E';
      replace=true;
      scope={};
      controller=TestController;
      controllerAs='Test';
      bindTocOntroller=true;
      link=(scope, elem, attr)=>{
        return new TestLink(scope, elem, attr);
      };
      template='<p>Hello</p>'
    }
    
    angular.module('App', [])
      .directive('test', ()=>new TestDirective);
    

    codepen 上的代码。

    【讨论】:

    • 这并没有解释原因,并且该示例没有任何 cmets 或关于它应该做什么的线索。请改进您的答案,以便对其他人有所帮助。
    • 还要注意你应该如何放置 Codepen 链接(他们的代码也在答案中)
    猜你喜欢
    • 2015-08-29
    • 2017-01-29
    • 1970-01-01
    • 1970-01-01
    • 2018-06-08
    • 2019-08-16
    • 1970-01-01
    • 2018-05-22
    相关资源
    最近更新 更多