Передача данных обратно контроллеру из директивы

Question

Структура моего кода: у меня есть родительский «компонент» с компонентом списка внутри этого. Я хочу щелкнуть по элементу элемента в компоненте списка и вернуть этот элемент функции в родительский компонент. Параметр внутри функции editMember это передается обратно утратившим

let ParentDirective =() => { 
    "use strict"; 
    return { 
     restrict: 'A', 
     scope: { 
      visible: '<', 
      members: '=' 
     }, 
     template: (() => { 
      return ` 
       <div> 
        <div list-directive 
         members="members" 
         edit="methods.editMember(member)"> 
        </div> 
       </div> 
      `; 
     })(), 
     controller: ($scope) => { 
      $scope.methods = { 
       editMember: (member) => { 
        console.log(member) //member is null 
       } 
      }; 
     } 
    } 
}; 

export default {directive: ParentDirective, name: 'parent'}; 



let ListDirective =() => { 
    "use strict"; 
    return { 
     restrict: 'A', 
     scope: { 
      members: '<', 
      editMember: '&edit' 
     }, 
     template: (() => { 
      return ` 
       <div> 

        <div ng-repeat="member in members"> 
         {{member.name}} 
           <button type="button" 
             ng-click="editMember(member)"> 
            <i class="ion-edit"></i> 
           </button> 
         </div> 
        </div> 

       </div> 
      `; 
     })(), 
     controller: ($scope) => { 
      } 
    } 
}; 

export default {directive: ListDirective, name: 'list'}; 

Answer 1

Лучше всего использовать EventEmitter для взаимодействия между ребенком и родителем компонентов в случае, если вы используете Угловая 2.

Посмотрите here для получения дополнительной информации о том, как это сделать.

Если вы используете Угловое 1 вы на треке записи, просто изменить ng-click="editMember(member)" к ng-click="editMember({member: member})", так как вы должны передать его как хэш:

<button type="button" 
    ng-click="editMember({member: member})"> 
    <i class="ion-edit"></i> 
</button> 

Обратите внимание, что вы должны назвать это то, что вы назвали ваш аргумент в родительском, например если вы определили ваш родитель так:

edit="methods.editMember(temp)" 

Тогда вы должны передать это нравится:

<button type="button" 
    ng-click="editMember({temp: member})"> 
    <i class="ion-edit"></i> 
</button>