Pasar valores de directiva del controlador

A continuación es mi plantilla html:

<div ng-app="dr" ng-controller="testCtrl">
    <test color1="color1" data-method="ctrlFn(msg)"></test>    
</div>

A continuación es mi código:

var app = angular.module('dr', []);
app.controller("testCtrl", function($scope) {
$scope.ctrlFn = function(arg) {        
alert(arg);
}
});
app.directive('test', function() {
return {
restrict: 'E',
scope: {
fromDirectiveFn: '&method'
},
link: function(scope, elm, attrs) {
//Way One
scope.hello = "some message";
scope.fromDirectiveFn(scope.hello);
}
}
});
<div ng-app="dr" ng-controller="testCtrl">
<test color1="color1" data-method="ctrlFn(msg)"></test>    
</div>

¿Por qué estoy recibiendo “indefinido” en lugar de “algún mensaje

A continuación es un violín
http://jsfiddle.net/j2K7N/27/

OriginalEl autor | 2015-06-26

3 respuestas

  1. 13

    El código es casi correcta, sin embargo, había varios problemas aquí:

    <test color1="color1" data-method="ctrlFn(msg)"></test>

    Aquí se pasa el ctrlFn() función de su controlador, que lo lleva a uno indefinido argumento msg, que hace que el mensaje de alerta con “indefinido” de texto. Sugiero modificar el código HTML para esto:

    <test color1="color1" data-method="ctrlFn"></test>  

    Nota que me pase el ctrlFn como una variable, no la función.

    En su directiva de código, he cambiado el ámbito de la unión a = para asegurarse de que el ctrlFn apuntará a su función de control. Esto también establece un enlace bidireccional entre el alcance de la directiva y el controlador (padre) ámbito de aplicación. A continuación, todo el código JS de la directiva tendrá este aspecto:

    app.directive('test', function() {
    return {
    restrict: 'E',
    scope: {
    fromDirectiveFn: '=method'
    },
    link: function(scope, elm, attrs) {
    //Way One
    scope.hello = "some message";
    scope.fromDirectiveFn(scope.hello);
    }
    }
    });

    Simplemente sustituyendo el & a =. De trabajo de la horquilla: http://jsfiddle.net/L8masomq/

    OriginalEl autor

  2. 2

    su bits de un capricho… leer más acerca de él aquí

    lo que usted necesita hacer es cambio por debajo de

    scope.fromDirectiveFn(scope.hello);

    a

     scope.fromDirectiveFn({'msg' : scope.hello});

    los nombres de las variables deben ser lo mismo en la llamada & destinatario

    OriginalEl autor

  3. 0

    De hecho, el código es correcto. Pero, el valor de msg es conseguir que los indefinidos. Por lo tanto, usted ctrlFn(msg) se devuelve como indefinido.
    añadir la propiedad ” msg ” y asignar el ámbito de aplicación.hola va a resolver el problema. Compruebe la mejora de la [Jsfiddle][1] aquí.

    scope.fromDirectiveFn({'msg': scope.hello}); 

    http://jsfiddle.net/imsabmaverick81/j2K7N/215/

    OriginalEl autor

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *