帶有動態控制器的AngularJS指令

Question

我有angularJS指令，並且我需要從控制器執行某些功能，但是例如，我需要使控制器動態化。

在html A.html中，我使用指令

指令模板代碼為：

template: '<div class="input-group autocomplete-holder"><form ng-submit="submit()">[...]</div>'

此html控制器中存在Submit（）方法，現在，我將控制器發送給指令以執行以下操作：

define(['angular', 'admin/AdminStockWarehouseController'], function (angular, AdminStockWarehouseController) {
    'use strict';

現在，我需要發送具有相同功能名稱的其他控制器，然后，這將失敗，然后我的問題是：

有什么方法可以讓當前控制器使用指令來使用對應的Submit函數或以表單Submit形式發送該函數？

Answer 1

您可以在指令范圍的定義中使用&來傳遞函數

module.directive("myDirective", function () {
    return {
        scope: {
           submit: '&'
        }
    };
});

該函數將通過您的指令的作用域變得可訪問，因此該指令的模板看起來像您描述的那樣：

<div class="input-group autocomplete-holder"><form ng-submit="submit()">[...]</div>'

您將使用如下指令：

<div ng-controller="MyController">
   <div my-directive submit="submitFunctionOne"></div>
   <div my-directive submit="submitFunctionTwo"></div>
</div>

這些功能在控制器中定義的位置：

module.controller('MyController', function() {
  $scope.submitFunctionOne = function() {...};
  $scope.submitFunctionTwo = function() {...};
});

這是一個很棒的視頻教程，解釋了如何完成此操作。