AngularJS:如何将数据从指令传递给控制器​​函数

Question

我正在尝试将指令中的一些数据传递给addTrackFromPicker我的控制器中的函数.

$scope.addTrackFromPicker = function (message) {
    console.log("addTrackFromPicker", message);
};

这是我在指令中的内容

dir.directive('youtubeList', function($http, $timeout, YT_event){
    return {
        restrict: 'E',
        scope: {
            search: '=',
            dial: '&'
        },
        templateUrl: 'youtube-list.html',
...

在这里,我想从我的模板中调用控制器函数并将其item.id.$t作为参数传递:

<div class="media list-group-item" ng-repeat="item in entries">
<a type="button" ng-click="dial(item.id.$t)">
    <img  ng-src="{{item.media$group.media$thumbnail[0].url}}">
</a>

但我不知道如何将它传递给我的标签

<youtube-list search="search" dial="addTrackFromPicker(???)"></youtube-list>

我也试过$parent.addTrackFromPicker但它没有用

Answer 1

为了从您的指令传递您的数据,您需要这样做:

<youtube-list search="search" dial="addTrackFromPicker(data)"></youtube-list>

然后,在您的模板中:

<div class="media list-group-item" ng-repeat="item in entries">
    <a type="button" ng-click="dial({data: item.id.$t})">
        <img  ng-src="{{item.media$group.media$thumbnail[0].url}}">
    </a>
</div>

您可以使用"参数名称",而不是其他data东西对您的情况更有意义.有关其工作原理的详细信息,请参阅Angular的文档scope.

Answer 2

隔离范围:将一些值从父范围传递给指令

AngularJS提供了3种类型的前缀

1. "@"(文本绑定/单向绑定)
2. "="(直接模型绑定/双向绑定)
3. "&"(行为绑定/方法绑定)

所有这些前缀都从指令元素的属性接收数据.

 class="directive"

 name="{{name}}"

 color="color"

当指令在scope属性中遇到前缀时,它将在指令的html元素上查找属性(具有相同的属性名称)

 scope : {    
  name: "@"    
 }

我已经关注了这个链接http://jsfiddle.net/shidhincr/pJLT8/10/light/