Javascript 在角度指令中将函数作为参数传递不'；行不通

我是angular方面的新手，我尝试在同一个控制器下连接两个独立的指令。我的项目是关于一个产品商店；第一个指令用一个按钮在列表中显示所有可用产品，第二个指令用详细信息显示信息。工作流程应该是这样的：当我点击产品的按钮时，详细信息应该与所选产品的内容一起重新加载

我想我已经完成了所有需要的连接，但仍然不起作用，当我点击按钮时，什么都没有发生。。。以下是我的声明：

• Main.html

  <div ng-controller="ProductController as productCtrl">
  <product-list data=productCtrl.productList></product-list>
  <product-details title={{productCtrl.activeProduct.title}} img={{productCtrl.activeProduct.imgSrc}} activator="productCtrl.setActiveProduct(p)"></product-details>
  <div>
  

• ProductList.html

  <table class="table">
      <thead>
        <tr>
          <th></th>
          <th>Name</th>
          <th>Price</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="product in data">
          <th scope="row">
            <button class="btn btn-info glyphicon glyphicon-play" ng-click='function(product)'></button>
          </th>
          <td>{{product.title}}</td>
          <td>{{product.price | currency}}</td>
          <td>
            <img ng-src={{product.imgSrc}} width=15%></img>
          </td>
        </tr>
      </tbody>
    </table>
  

有什么想法吗

谢谢大家：）

编辑：问题是： -1:这个论点的指令是错误的。 -2:我写的函数不好，要设置参数，需要通过以下方式绑定数据：

    ng-click='function({product:product})'

Instead of 

    ng-click='function(product)'

Calling in the HTML directive by this way:

    <product-list data=productCtrl.productList activator="productCtrl.setActiveProduct(product)"></product-list>

ng click='function（{product:product}）'
而不是
ng单击“功能（产品）”按钮
通过以下方式调用HTML指令：

感谢您的帮助：）。

有两个问题

• 您没有将

  function=“expression”

  传递到

  生产列表

  指令

• &

  表达式在作用域上工作，因此必须在作用域中定义函数

“严格使用”；
angular.module（'angulartestapp'，[]）
angular.module（'angulartestapp'）
.directive（“productList”，function（）{
返回{
限制：'E'，
范围：{
数据：“=”，
函数：“&激活器”
},
模板：“NamePrice{{product.title}{{product.price | currency}}”
}
});
angular.module（'angulartestapp'）
.controller（'ProductController'，函数（$scope）{
this.productList=[{
标题：1，
价格：1
}, {
标题：2，
价格:2
}];
this.activeProduct={
“标题”：“周末赞美诗”，
“imgSrc”：“images/hymm.jpg”，
“价格”：“2”
};
var ctrl=this；
$scope.setActiveProduct=函数（p）{
ctrl.activeProduct=p；
console.log（'activeProduct'+ctrl.activeProduct，ctrl）；
}
});

{{productCtrl.activeProduct}
您是否在使用
产品详细信息
指令？您可以发布该指令的示例代码吗？函数是保留关键字，缺少productDetails指令。有可能创建一个fiddle吗？对不起，问题是我在weong指令中设置了参数，并将函数的参数写坏了。谢谢回复！：）哦，我的上帝！第一个问题就像一个笑话，我在错误的指令中设置了参数！（很抱歉）。我不太明白为什么需要在$scope中设置控制器的函数，如果我这样做了，函数就永远不会被触发，但是如果我将其设置为控制器，一切正常：）。问题是，当我在HTML中为函数设置参数时，格式是错误的，下面是我修改的：函数（{product:product}）是顶部HTML中的“product”参数（activator=“productCtrl.setActiveProduct（product）”>）。谢谢你的帮助：D！
'use stricts'

angular.module('angularTestAppApp')
  .controller('ProductController', function(productListService) {

    ...

    this.activeProduct = {
      "title": "Hymn for the Weekend",
      "imgSrc": "images/hymn.jpg",
      "price": "2"
    };

    this.setActiveProduct = function(p) {
      this.activeProduct = p;
      console.log('Active product ' + this.activeProduct);
    }

  });

    ng-click='function({product:product})'

Instead of 

    ng-click='function(product)'

Calling in the HTML directive by this way:

    <product-list data=productCtrl.productList activator="productCtrl.setActiveProduct(product)"></product-list>