带动态控制器的AngularJS指令

时间:2014-04-07 12:08:17

标签: javascript angularjs angularjs-directive

我有一个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';

现在,我需要发送其他具有相同功能名称的控制器,然后,这将失败,那么我的问题是:

有没有办法让指令中的当前控制器使用相应的提交函数或者在表单提交时发送函数?

1 个答案:

答案 0 :(得分:0)

您可以在指令范围的定义中使用&来传递函数

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() {...};
});

Here是一个很棒的视频教程,解释了这是如何完成的。