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

我创建了一个自定义指令，其中包含一个隔离范围，该范围与封闭控制器中的函数以及对templateUrl的引用进行绑定。这里是我的代码如下所示：带有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：使用范围$申请（），$解析链接，但还没有尝试过

有人可以告诉我怎么做，也可以向我解释link部分（我不明白那部分），如果你感觉生成如图所示，显示工作的替代方案。由于

来源

2014-10-22 menorah84

（1）'find。（stuff）'是错误的语法 - 点不应该在那里。（2）在指令的范围内是否有一个函数'find'？从设置中，该功能被称为“搜索”。 – 2014-10-22 09:33:59

@NikosParaskevopoulos（1）更正了'。'，这只是一个错字（2）函数find在控制器中，我将它作为指令的搜索。 – menorah84 2014-10-22 09:40:32

您不必过时了你的函数只是参考PARAMS所以在你的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.data = { 
    id: 1, 
    value1: "value1", 
    value2: "value2" 
} 

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

且模板中直接就把

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

我希望这回答你的问题

关于链接本文从角的js文档是很清楚，我认为

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

范围是一个角度范围对象。元素是jqLite包装的

此指令匹配的元素。 attrs是一个具有标准化属性名称及其对应属性值的键值对的散列对象。

在我们的纽带作用，我们要更新显示的时间每秒一次，或每当用户改变了我们的指令结合的时间格式化字符串。我们将使用 $ interval服务定期调用处理程序。与使用$ timeout相比，这更容易，但在端到端测试中效果更好，我们希望确保所有$超时在完成测试之前已完成。如果指令被删除，我们也想删除$ interval，所以我们不会引入内存泄漏。

来源

2014-10-22 09:36:03

我没有使用'$ scope'。我正在使用'var self = this; self.methodName = function ...'来公开我的控制器方法。你的建议似乎工作，如果我使用'$范围'，但不是我目前的设置。我将不得不改变太多的东西，包括那些如果我改变到'$ scope'的话，我就不会工作的东西。任何想法如何使用'this.methodName'来完成这项工作？ – menorah84 2014-10-22 11:04:33

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

回答

相关问题