时间戳

首页 > 解决方案 > AngularJS 指令表达式绑定与 `"&"` 函数和参数

javascript - AngularJS 指令表达式绑定与 `"&"` 函数和参数

问题描述

我正在开发一个多选指令，类似于 AngularJs 的 isteven 指令。我无法解决的是我想包含回调函数，可以传递参数，在控制器中达到它们各自的功能。为此，请使用“&”运算符，但例如，如果我想在控制台中看到一个对象，则只显示“未定义”。

我举个例子：

模板HTML：

<li ng-repeat="data in inputData">
      <span ng-click="onItemClick()">{{data.name}}</span>
</li>

JS（指令）：

debFrontApp.directive('debSelect', function () {
    return {
      restrict: "AE",
      transclude: true,
      templateUrl: function (element, attrs) {
        if(!attrs.basePath){
          attrs.basePath = "/assets/debfront";
        }
        return attrs.basePath + "/templates/debselect.html";
      },
      scope: {
        multiSelect: '=',
        selectName: '@',
        inputData: '=inputData',
        outputData: '=outputData',
        onItemClick: '&'
      }
    };
});

JS（控制器）

$scope.testfuctionBye = function(data){
    console.log(data);
};

该函数返回一个未定义的值。一些帮助？谢谢！

标签： javascriptangularjsangularjs-directive

解决方案

使用表达式绑定需要使用本地对象：

<li ng-repeat="data in inputData">
      <span ng-click="onItemClick({$event: data})">{{data.name}}</span>
</li>

用法：

<deb-select on-item-click="vm.onClick($event)" input-data="vm.dataArr">
</deb-select>

当调用表达式绑定时，locals 对象定义$event.

从文档：

  • &或&attr- 提供一种在父作用域的上下文中执行表达式的方法。如果未指定 attr 名称，则假定属性名称与本地名称相同。给定<my-component my-attr="count = count + value">和隔离范围定义scope: { localFn:'&myAttr' }，隔离范围属性localFn将指向count = count + value表达式的函数包装器。通常希望通过表达式将数据从隔离范围传递到父范围。这可以通过将局部变量名称和值的映射传递到表达式包装器 fn 来完成。例如，如果表达式是，那么我们可以通过调用asincrement($amount)来指定金额值。localFnlocalFn({$amount: 22})

有关详细信息，请参阅

推荐阅读