无法将参数从指令传递给控制器函数

I can call the function from my directive but the parameter keeps being passed as undefined.

我可以从我的指令调用函数，但是参数一直作为未定义的方式传递。

Here's the line from the directive

这是指令中的一条线

<input ng-click="delete(0)" type="submit" id="submit" value="Delete Feed" />

and here's the directive

这是该指令

<testdirective delete="deleteFeed()"></testdirective>

And here's the function

这是函数

 $scope.deleteFeed = function(x){
  console.log(x);
  $scope.tweets.splice(x, 1);
}

and finally the directive itself

最后是指令本身

app.directive("testdirective", function() {
return {
  restrict: "E",
  templateUrl: 'app/main/tweetboard.html', 
  scope: {
    delete:'&'
  },

};

});

Thanks!

谢谢!

4 个解决方案

#1

Try following 2 things:

试试以下两件事:

Replace the directive using by this: <testdirective delete="deleteFeed(feed)"></testdirective>

使用以下命令替换该指令:
The pointed line from directive replace by <input ng-click="delete({feed:0})" type="submit" id="submit" value="Delete Feed" />

用

The point with @ binding form is that a function wrapper will be created & it will point to the original function. To call the original function with parameter you need to pass an object to the wrapper function, the key of the object is the name of the parameter.

@ binding表单的要点是将创建一个函数包装器，它将指向原始函数。要使用参数调用原始函数，需要将对象传递给包装器函数，对象的键是参数的名称。

Example from official angular docs:

来自官方角度文档的例子:

Given <widget my-attr="count = count + value"> and widget definition of scope: { localFn:'&myAttr' }, then isolate scope property localFn will point to a function wrapper for the count = count + value expression. Often it's desirable to pass data from the isolated scope via an expression to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount:22})

给定和范围的小部件定义:{localFn:'&myAttr'}，然后隔离作用域属性localFn将指向count = count + value表达式的函数包装器。通常希望通过表达式将数据从隔离范围传递到父范围，这可以通过将本地变量名称和值映射传递到表达式包装器fn来实现。例如，如果表达式是increment(amount)，那么我们可以通过将localFn调用为localFn({amount:22})来指定amount值

#2

try as attribute instead of scope

尝试作为属性而不是范围。

app.directive("testdirective", function() {
    return {
      restrict: "E",
      templateUrl: 'app/main/tweetboard.html', 
      link: function(scope, elem, attrs) { 
          if(attr.deleteFeed)
              scope.$apply(attr.deleteFeed);
      }
    };
});

HTML

<testdirective delete="deleteFeed()"></testdirective>

#3

Here is the working solution:

以下是可行的解决方案:

Plunkr

You forgot to pass in the parameter so it was always undefined.

您忘记传递参数，所以它总是未定义。

// Code goes here

/ /代码在这里

var app  =angular.module('test', []);

app.controller('testController', function($scope){
  $scope.x = "test";
  $scope.deleteFeed = function(x){
    alert(x);
  }
})

app.directive("testdirective", function() {
return {
restrict: "E",
template: '<input ng-click="delete(x)" type="submit" id="submit" value="Delete Feed" />',
scope: {
    delete:'&'
}
  };
});

#4

It is simple way to pass pa-ram in function from directive to parent controller:

将pa-ram函数从指令传递给父控制器是一种简单的方法:

In parent view:

在父视图:

<div  menubar activatetab="cdCtrl.activateTab(id)"></div>

In directive:

在指令:

<div ng-click="activatetab({id:10})>Click here...</div>

In parent controller:

在父母控制器:

$scope.activateTab(id) =function(){    
                alert(id);

}

Hope it working for you!!

希望它对你有用!!

#1