Question

我创建了一个带有隔离范围的自定义指令，该范围绑定到封闭控制器中的函数以及对templateUrl的引用。这是我的代码的样子：

html

<div ng-controller='MyCtrl as my'>
    <custom-directive data='my.data' on-search="my.find(param1, param2)"></custom-directive>
</div>

指令

app.directive('customDirective', function() {

    return {
        restrict : 'E',
        scope : {
            data : '=data'
            search : '&onSearch',
        },
        templateUrl : 'customDirective.html'
    };
});

模板

<div>
    <input ng-model='data.id'>
    <a ng-click='find(param1, param2)'></a>

</div>

函数find收到的参数也存储在data中。控制器data绑定到指令但不绑定到函数。我在函数中的日志甚至都不显示。

似乎有不同的方法可以做到这一点，正如我在许多例子中看到的那样（见下文），但似乎没有一种方法适用于我的情况。

示例1：传递模板中参数和值的映射

<div>
    <input ng-model='data.id'>
    <a ng-click='find.({param1: data.value1, param2: data.value2})'></a>

</div>

示例2：在指令

中放置一个链接

app.directive('customDirective', function() {

    return {
        restrict : 'E',
        scope : {
            data : '=data'
            search : '&onSearch',
        },
        templateUrl : 'customDirective.html',
        link : function(scope, elem, attr) {
            scope.retrieve({param1: scope.data.value1,
                            param2: scope.data.value2});
        }

    };
});

示例3：使用范围。$ apply（），$ parse in link但尚未尝试此

有人可以告诉我怎么做，并向我解释link部分（我不理解那部分），如果你感到慷慨，请展示实例所示的工作方案。感谢

Answer 1

你不必在你的html

中为你的函数传递参数

<custom-directive data='my.data' on-search="my.find"></custom-directive>

和你的模板指令直接调用

<div>
    <input ng-model='data.id'>
    <a ng-click='find(data.value1, data.value2)'></a>
</div>

我还建议您使用$ scope而不是控制器。所以在你的控制器中定义

$scope.data = {
    id: 1,
    value1: "value1",
    value2: "value2"
}

$scope.find = function (param1, param2) {
   //Your logic
}

并在您的模板中直接放置

<custom-directive data='data' on-search="find"></custom-directive>

我希望能回答你的问题

关于链接来自angular js doc的这段文字很清楚我认为

想要修改DOM的指令通常使用链接选项。   link采用具有以下签名功能的函数   链接（范围，元素，attrs）{...}其中：

scope是一个Angular范围对象。 element是jqLite-wrapped

此指令匹配的元素。   attrs是一个哈希对象，具有标准化属性名称和它们的键值对   相应的属性值。

在我们的链接功能中，我们想要更新   每秒显示一次，或者每当用户更改时间时   格式化我们的指令所绑定的字符串。我们将使用   $ interval服务定期调用处理程序。这更容易   比使用$ timeout还要更好地进行端到端测试，   我们希望确保之前完成所有$ timeout   完成测试。我们还想删除$ interval   指令被删除，因此我们不会引入内存泄漏。

带有templateUrl的指令中的函数参数

1 个答案: