Pergunta

Estou criando uma diretiva personalizada onde preciso atribuir uma função dentro do objeto que será usada ao passar para minha diretiva.No entanto, se eu passar o método escrevendo diretamente o nome da função dentro do modelo, tudo funcionará bem.Mas se eu atribuir essa referência de método a uma das propriedades do meu objeto e então estiver usando isso em meu modelo para passá-lo para a diretiva, mas isso não está funcionando.

Você pode ver aqui - jsfiddle

Você pode ver no console.Clique no botão Salvar, ele chamará a função salvar dentro da diretiva, mas a partir daí estou chamando o método do controlador que não está funcionando.Mas se você escrever o nome da função blabla em vez de dynamicMethods.myMethod então ele ligará, mas recebi um alerta interno indefinido.

Obrigado.

Foi útil?

Solução

Você acertou quase.

O primeiro erro foi quando você definiu dynamicMethods objeto que você está referenciando $scope.blabla que ainda não existia.

O segundo erro foi quando você está passando valores para o accept chamada de função que você vinculou ao escopo pai, você precisa passá-la como:

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

onde msg é uma variável local chamada que pode ser usada no valor da expressão de accept atributo em sua chamada de diretiva personalizada <editkeyvalue accept="dynamicMethods.myMethod(msg)" ...

eu atualizei seu violino de acordo.

Quando você escreve accept: "&" você está dizendo angular para

  1. usar $parse serviço para analisar expressão (dynamicMethods.myMethod(msg))
  2. "ligar" (através fechamento javascript) $scope da função retornada da etapa 1 para o escopo original (escopo do controlador no seu caso)
  3. armazene a função dentro accept propriedade do escopo local da sua diretiva.

Agora, se você inspecionar o conteúdo de $scope.accept pouco antes de chamá-lo na diretiva, você verá algo semelhante a:

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

onde locals é um objeto com variáveis ​​​​locais usado quando alcançamos a avaliação da função retornada de $parse.Como não há parâmetros nomeados em javascript e não queremos apontar de alguma forma que o valor da variável local msg é "from dir", estamos passando-o como um objeto simples onde a chave indica o nome da variável {msg: "from dir"}.

Angular examinará a expressão (uma string) para avaliar e descobrir que msg está entre colchetes, portanto, parece um parâmetro, cujo valor pode ser encontrado em locals objeto.

Quando chegar a hora de chamar a função real, angular irá converter locals objeto para array regular - preservando a ordem dos parâmetros que ele lê da expressão e chama a função de maneira semelhante a:

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

Espero que isso ajude um pouco a entender o que está acontecendo.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top