Передача динамических методов пользовательской директиве в angular

Question

Я создаю пользовательскую директиву, где мне нужно назначить функцию внутри объекта, которая будет использоваться при переходе к моей директиве.Однако, если я передаю метод, записывая непосредственно имя функции внутри шаблона, он работает нормально.Но если я назначаю ссылку на этот метод одному из свойств моего объекта, а затем я использую это в своем шаблоне для передачи его в директиву, но это не работает.

Вы можете посмотреть здесь - jsfiddle

Вы можете посмотреть в консоли.Нажмите на кнопку Сохранить, она вызовет функцию сохранения внутри директивы, но оттуда я вызываю метод контроллера, который не работает.Но если вы напишете имя функции blabla вместо dynamicMethods.myMethod тогда он вызовет, но при этом я получил неопределенное внутреннее предупреждение.

Спасибо тебе.

Answer 1

Ты все сделал почти правильно.

Первая ошибка была, когда вы определили dynamicMethods объект, на который вы ссылаетесь $scope.blabla которого еще не существовало.

Вторая ошибка заключалась в том, что вы передавали значения в accept вызов функции, которую вы привязали к родительской области, вам нужно передать как:

$scope.accept({msg: "from dir"})

где msg является локальной переменной с именем, которая может быть использована в значении выражения accept атрибут при вызове вашей пользовательской директивы <editkeyvalue accept="dynamicMethods.myMethod(msg)" ...

Я обновил твоя скрипка соответственно.

Когда ты пишешь accept: "&" вы говорите angular, чтобы

1. использовать $parse сервис для синтаксического анализа выражения (dynamicMethods.myMethod(msg))
2. "привязать" (через закрытие javascript) $scope из функции, возвращенной с шага 1 в исходную область (область контроллера в вашем случае)
3. сохраните функцию внутри accept свойство вашей директивы local scope.

Теперь, если вы проверите содержимое $scope.accept непосредственно перед тем, как вы вызовете это в директиве, вы увидите что-то похожее на:

function (locals) {
  return parentGet(parentScope, locals);
}

где locals является объектом с локальными переменными, используемыми, когда мы достигаем оценки функции, возвращаемой из $parse.Поскольку в javascript нет именованных параметров, и мы не хотим каким-либо образом указывать, что значение локальной переменной msg это "from dir", мы передаем его как простой объект, где ключ указывает на имя переменной {msg: "from dir"}.

Angular просмотрит выражение (строку) для вычисления и обнаружит, что msg находится внутри квадратных скобок, таким образом, он выглядит как параметр, значение которого можно найти в locals объект.

Когда придет время вызывать фактическую функцию, angular преобразует locals преобразуйте объект в обычный массив, сохраняя порядок параметров, которые он считывает из выражения, и вызывайте функцию способом, аналогичным:

var locals = {msg: "from dir"};
var targetFn = dynamicMethods.myMethod;
var context = dynamicMethods;
targetFn.apply(context, ["from dir"]);

Надеюсь, это немного поможет понять, что происходит.