【问题标题】:Best way to expose angularjs controller methods when using typescript?使用打字稿时公开 angularjs 控制器方法的最佳方法?
【发布时间】:2015-05-29 19:06:03
【问题描述】:

我知道一种方法是将控制器对象附加到下面的范围。

interface IAppCtrlScope extends ng.IScope {
   info: any;
}

class InfoCtrl {
    header: string;
    name: string;

    public static $inject = ["$scope"];
    constructor(private $scope: IAppCtrlScope) {        
       this.$scope.info= this; //expose controller
    }

    getData(): void {
      //do something
    }    
}

在这种情况下,视图将是这样的,

<div ng-controller="InfoCtrl">
    <div class="rm-dialog-header">{{info.header}}</div>
    <span ng-click="info.getData()">{{info.name}}</span>
</div>

除了上述方法之外,还有一种方法可以公开控制器,这样我就不必在每个范围变量前面加上“info.”。这样视图会是这样的,

<div ng-controller="InfoCtrl">
    <div class="rm-dialog-header">{{header}}</div>
    <span ng-click="getData()">{{name}}</span>
</div>

有可能还是我错过了什么?

【问题讨论】:

  • 在你得到答案之前,here 是我如何将它与工作中的 plunker 一起使用
  • @RadimKöhler,感谢您的链接,非常有用!

标签: angularjs typescript


【解决方案1】:

您可以直接在 $scope 上公开您的类中的方法

interface IAppCtrlScope extends ng.IScope {
   getData: () => void;
}

class InfoCtrl {
    header: string;
    name: string;

    public static $inject = ["$scope"];
    constructor(private $scope: IAppCtrlScope) {        
       $scope.getData = this.getData; //expose method
    }

    getData = () => {
      //do something
    }    
}

然后在你的标记中你可以直接绑定到getData()

只需确保使用语法method = () =&gt; {} 声明您的方法,这会将方法放在实例上而不是原型上。

【讨论】:

  • 请阅读 Angular 风格指南中的 Y030 并改用 controller as$scope 现在确实是一个已弃用的概念,尤其是如果您希望将来迁移到 Angular 2。
猜你喜欢
  • 2012-12-08
  • 1970-01-01
  • 1970-01-01
  • 2016-03-05
  • 1970-01-01
  • 2018-07-04
  • 1970-01-01
  • 2013-12-23
  • 2019-05-31
相关资源
最近更新 更多