如何調用從嵌套指令角速度控制器範圍方法打字稿

鑑於以下常見的設置：如何調用從嵌套指令角速度控制器範圍方法打字稿

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

如何調用從嵌套指令角速度控制器範圍方法打字稿

回答

相關問題