從指令中的祖先範圍的AngularJS調用方法

我有一個Angular應用程序，我正在使用ui-grid。我想在網格的一個單元格上調用一個自定義的動作方法。所以基本上，這意味着從一個指令調用父級層次結構中的某個方法。這可以通過調用類似於$ scope。$ parent。$ parent。$ parent。$ parent.foo（）來實現。但那看起來不太好。從指令中的祖先範圍的AngularJS調用方法

一種選擇是創建一個遞歸函數，該函數沿着$ scope的祖先行進。這更好，但仍然有點奇怪。

另外...是不是很好的做法來嘗試實現這樣的事情？

來源

2015-09-02 Florin Vistig

可能使用'event'。 – Joy

你是對的，$parent.$parent.$parent絕對不是一個好習慣。

如果你調用的方法是另一種指令，你可以要求指令在你的孩子的指令，然後將parentDirective的控制器功能將被注入的第四個參數的鏈接功能：

在您的DDO ：

return { 
    require : '^parentDirective', 
    restrict : 'E', 
    link : function (scope, elem, attrs, parentDirectiveController) {} 
}

如果你想叫什麼在工廠/服務，你可以注入該工廠/服務到您的指令，雖然這有時是一個代碼的氣味，這取決於你在做什麼試圖注入。

最後，另一種方法是使用事件傳播。從你的指令，你可以使用$scope.$emit將信息發送多達父控制器：

從指令：

$scope.$emit('directiveDidStuff', { 
    data : 'blah' 
});

在父控制器：

$scope.$on('directiveDidStuff', function (evt, params) { 
    this.data = params.data; // equals blah 
});

來源

2015-09-02 12:52:31 sma

$ emit方法正是我所需要的。謝謝！ –

可以實現通過使用相同「&」通過指令中的一個範圍變量。類似於this，您可以將您的事件綁定到控制器方法，並從該方法中，您可以執行所需的事情，或者如果原始業務邏輯您希望在網格的onClick上實現的功能可以跨越多個模塊使用，而不是在服務中將其分爲兩部分並使其可重用並從事件方法調用服務。如果您對此方法有任何疑問，請告訴我。

主要例子代碼：

的Html

<my-component attribute-foo="{{foo}}" binding-foo="foo" isolated-expression- foo="updateFoo(newFoo)" >

指令

var myModule = angular.module('myModule', []) 
.directive('myComponent', function() { 
    return { 
     restrict:'E', 
     scope:{ 
      /* NOTE: Normally I would set my attributes and bindings 
      to be the same name but I wanted to delineate between 
      parent and isolated scope. */     
      isolatedAttributeFoo:'@attributeFoo', 
      isolatedBindingFoo:'=bindingFoo', 
      isolatedExpressionFoo:'&' 
     }   
    }; 
})

來源

2015-09-02 13:22:56 road2victory

從指令中的祖先範圍的AngularJS調用方法

回答

相關問題