javascript - directivas - AngularJS: ¿Pasar una función a un ámbito aislado de una directiva a ser llamada dentro de su controlador?

ng-init

Question

Estoy tratando de llamar a una función pasada del alcance de un controlador a una directiva a través de la operación "&" desde el controlador de la directiva. Sin embargo, Angular afirma que ese método no está definido. Después de leer mi código una y otra vez, buscar en Internet y luego repetir ese proceso, he decidido recurrir para ayudar aquí.

Aquí está la parte relevante de mi controlador. Contiene el método que paso a mi directiva.

angular.module(''myApp.controllers'', []).controller(''PostCtrl'', [''$scope'', ''postalService'', function($scope, postalService) {
    $scope.posts = [];

    $scope.getPosts = function() {
        postalService.getPosts(function(err, posts) {
            if(err);
            else $scope.posts = posts;
        });
    };
}]);

Aquí está mi directiva. No puedo invocar onPost.

angular.module(''myApp.directives'', []).directive(''compose'', [''postalService'', function(postalService) {
    return {
        restrict: ''E'',
        transclude: false,
        replace: true,
        scope: {
            onPost: "&" //why will it not
        },
        templateUrl: "partials/components/compose-partial.html",
        controller: function($scope, postalService) {
            $scope.title = "";
            $scope.content = "";
            $scope.newPost = function() {
                postalService.newPost($scope.title, $scope.content, function(err) {
                    if(err) console.log(err + ":(");
                    else {
                        console.log("Success getting posts.");
                        //why can I not invoke onPost()??
                        $scope.onPost();
                    }
                });
            };
        },
    };
}]);

Y aquí está la parte relevante de mi html.

<div ng-controller="PostCtrl">
    <section class="side-bar panel hide-for-small">
        <compose onPost="getPosts()"></compose>
    </section>

    <!--more, non-relevant html here-->

</div>

Sé que el problema no es con mi servicio de servicio postal. En cambio, la directiva informa que no se le pasa ninguna función. ¿¿Por qué??

Answer 1

Reemplazar

<compose onPost="getPosts()"></compose>

con

<compose on-post="getPosts()"></compose>

y funcionará.

Los documentos angulares dicen por qué es así:

Las directivas tienen nombres en camello como ngBind. La directiva se puede invocar traduciendo el nombre de la caja del camello al caso de la serpiente con estos caracteres especiales:, -, o _.