L'appel d'une fonction init lorsqu'une directive est chargé

J'ai une simple directive que les charges des commentaires à partir d'un service(commentsService):

'use strict';

angular.module('mean.rank')
    .directive('commentList', function(CommentsService, Global) {
        return {
            restrict: 'E',
            templateUrl:  'rank/views/comments-list.html',
            replace: false,
            link: function($scope, element, attrs) {
                //accessing the ad info :  console.log("ADD  " , $scope.ad);
                $scope.comments = [];

                $scope.loadComments = function () {
                    console.log("in loadComments");
                    var adID = {};
                    adID.ad_ID = $scope.ad.nid;
                    console.log("calling services.getComments function with  " , adID.ad_ID);
                    CommentsService.getComments(adID.ad_ID)
                        .then(function (response) {
                            angular.forEach(comment in response)
                            $scope.comments.push(comment);
                        });


                };


            }
        }
    })

Le chargé de commentaires doit être chargé sur la liste(à l'intérieur de la templateUrl) à l'aide de ng-init et le service pour le chargement (je vais ajouter le code si nécessaire).

<div ng-init="loadComments()">
    <ul class="media-list comment-detail-list" >
        <li class="media" ng-repeat="comment in comments" >
            <article>
                <div class="pull-left comment-info">
                    <a href="#" class="author">{{ comment.author }}</a><br />
                    <time>{{ comment.datePublished | date:"MM/dd/yyyy" }}</time>
                </div>
                <div class="media-body">
                    <div class="comment-body">
                        <p>{{ comment.comment }}</p>
                    </div>
                </div>
            </article>
        </li>
        <li>Debugger</li>
    </ul>
</div>

La directive a dans son champ d'application les loadCommets() fonction, mais il n'est pas déclenché.
Merci pour votre aide!

OriginalL'auteur Itsik Mauyhas | 2015-10-26

  1. 5

    Je te suggère de mettre de l'appel de fonction à l'intérieur de la fonction de lien lui-même au lieu de ng-init.

    angular.module('mean.rank')
    .directive('commentList', function(CommentsService, Global) {
        return {
            ...
            link: function($scope, element, attrs) {
                //accessing the ad info :  console.log("ADD  " , $scope.ad);
                $scope.comments = [];

                $scope.loadComments = function () {
                    ...
                };

                $scope.loadComments();
            }
        }
    })

    Edit: par la façon dont votre forEach syntaxe est incorrecte. Il devrait être

    angular.forEach(response, function(comment){
    $scope.comments.push(comment);
});
    Il fonctionne! mais il sera init $champ d'application.commentaires tableau avant que la liste est affichée à l'utilisateur?
    Vous pouvez toujours supposer UI serait chargé avant que les données dans un typique basé sur ajax vue. Si vous souhaitez masquer une partie de la vue avant le chargement des données, vous aurez besoin d'utiliser ng-show/ng-hide que jusqu'à ce que les données sont disponibles.

    OriginalL'auteur Icycool