如何调用从嵌套指令角速度控制器范围方法打字稿

鉴于以下常见的设置：如何调用从嵌套指令角速度控制器范围方法打字稿

CtrlA (page level controller) 
    |- directiveAA (component e.g. button bar) 
    |- directiveAAA (sub-component e.g. button)

我想通过使用指令属性传递下来了methodA链调用从directiveAAA CtrlA.methodA（） - CtrlA -> directiveAA -> directiveAAA。因此，例如我的directiveAAA“保存”按钮可以调用控制器方法“保存”。组件directiveAA和directiveAAA是愚蠢的组件，只知道属性设置的环境。

在Typescript之前，我会利用继承范围向下调用控制器方法$scope.save()从directiveAAA。

这将如何与Typescript一起工作？我们是否仍然必须将注入范围用于控制器，指令控制器类，还是可以在不使用范围的情况下基于类继承来完成？

因此，这里是我的代码的问题 - 它可能并不完美，但给人的要点 - 这个问题的要点标有注释“这是我需要帮助”：

module app.page { 

    class CtrlPage { 
     private ctrlPageBtnActions: string[] = ['goPrev', 'goNext']; 
     goPrev(){ 
      console.log('go previous'); 
     } 
     goNext(){ 
      console.log('go next'); 
     } 
    } 

    function pageDirective(){ 
     return { 
      restrict: 'E', 
      replace: true, 
      template: '<button-bar actions="CtrlPage.ctrlPageActions"></button-bar>', 
      controller: CtrlPage, 
      controllerAs: 'ctrlPage', 
      bindToController: true 
     } 
    } 

    angular.module('app') 
     .directive('page', pageDirective); 
} 


module app.page.directives { 

    class CtrlBtnBar { 
     private actions: string[]; 
    } 

    function buttonBar() { 
     return { 
      restrict: 'E', 
      replace: true, 
      template: '<div class="buttonBar"><btn action="CtrlBtnBar.actions[0]"></btn><btn action="CtrlBtnBar.actions[1]"></btn></div>' 
      controller: CtrlBtnBar, 
      controllerAs: 'CtrlBtnBar', 
      bindToController: { 
       actions: '=' 
      } 
     } 
    } 

    angular.module('app') 
     .directive('buttonBar', buttonBar); 
} 

module app.page.directives { 
    class CtrlBtn { 
     private action: string; 
     handleClick(){ 
      if (action === 'goNext'){ 
       CtrlPage.goNext(); /// Here is where I need help 
      } 
     } 
    } 

    function btnDirective(){ 
     return { 
      restrict: 'E', 
      replace: true, 
      template: '<input type="button" value="someCaption" ng-click="CtrlBtn.handleClick()"/>', 
      controller: CtrlBtn, 
      controllerAs: 'ctrlBtn', 
      bindToController: { 
       action: '@' 
      } 
     } 
    } 

    angular.module('app') 
     .directíve('btn', btnDirective); 
}

如果您运行的代码在http://www.typescriptlang.org/Playground中，您会看到打字稿可以理解为从btnDirective控制器CtrlBtn中反对CtrlPage引用，因为在此上下文中CtrlPage不存在。我们必须使用角度$范围来访问“goNext”方法，因为btnDirective是愚蠢的，并且不知道它的父级控制器并且只接收来自其属性的输入？考虑到radim的提示，我想答案是肯定的。

来源

2015-12-05 Kieran Ryan

Typescript与AngularJS（ver 1）不会给角度的架构/设计带来任何变化。所以范围是范围，并且因为他们没有他们将继承（通过.$new()）

此外，任何打字稿class继承对$scope继承没有影响。而这甚至不会与角2.更改如果某些component（有点像今天的打字稿controller类）将使用代码从其父（从中获得） - 在运行时，它会具有不影响其上下文。

因此，像你一样使用角度，只是从强类型语言支持中获益。

检查这些问与答&一个有工作的例子有指令：

来源

2015-12-05 18:44:04

看起来问题解决了 '这' 在控制器词汇用法类。而这种行为又与TS直接无关。 – estus

如何调用从嵌套指令角速度控制器范围方法打字稿

回答

相关问题