Comment passer des données du contrôleur à la directive personnalisée

Question

Je crée une directive personnalisée dans AngularJS. Cette directive devrait ouvrir un popup pour afficher les données. Le code de la popup est dans une autre page html et la directive personnalisée injecte le code dans ma page principale. Je suis capable d'ouvrir le popup mais je ne peux pas afficher les données existantes n'importe où dans la pop-up.

Normalement, je suis en mesure d'afficher les données dans la page principale, mais les données ne veulent tout simplement pas entrer dans le code HTML injecté par la directive personnalisée.

Comme ceci je n'obtiens aucune erreur cependant il ne passe pas les données.

Note: J'ai dû couper une partie du code ici pour le simplifier.

C'est ma directive sur mesure:

function updateCandidatePopup() { 
    var directive = {}; 
    directive.restrict = "E"; 
    directive.scope = {}; 
    directive.templateUrl = "UpdateCandidatePopup.html"; 
    directive.controller = function ($scope) { 
     $scope.SingleCandidate; 
    } 
    return directive; 
} 

C'est là que je l'enregistrer:

myApp.directive("updateCandidatePopup", UpdateCandidatePopup); 

Voici comment j'utilise la directive dans le mainpage

<update-candidate-popup value="SingleCandidate" class="modal fade" ng-model="SingleCandidate" 
         id="myUpdateModal" 
         role="dialog" 
         popup-data="SingleCandidate"> 
zxc</update-candidate-popup> 

C'est le UpdateCandidatePopup.html:

<div> {{SingleCandidate.FirstName}} </div> 

C'est pour afficher les données dans le contrôleur pop-up: (Pour votre information, il est toujours coupé)

myApp.controller('CandidatesController', function ($scope, $http, EmployerService, CandidateService) { //we injected localservice 
    //Select single data for update 
    $scope.getSingleData = function (C_ID) { 
     alert(C_ID); 
     $http.get('http://localhost:49921/api/Candidates/?C_ID=' + C_ID).success(function (data) { 
      $scope.SingleCandidate = data; 
      $scope.FName = $scope.SingleCandidate.FirstName; 
      alert($scope.SingleCandidate.FirstName); 
      alert($scope.FName); 
     }).error(function() { 
      $scope.error = "An Error has occured while loading posts!"; 
     }); 
    }; 

});

Answer 1

Désolé, je me trompe, j'ai répondu à votre question, je pars, j'ai trouvé un code qui servira à votre problème. En arrière-plan du modèle que vous voulez prendre, vous laissez un contrôleur et dans l'énoncé de votre politique, vous mettre à faire avec ces valeurs, je pense que dans votre cas, c'est juste l'impression.

myApp.directive('editkeyvalue', function() { 
return { 
    restrict: 'E', 
    replace: true, 
    scope: { 
     key: '=', 
     value: '=', 
     accept: "&" 
    }, 
    template : '<div><label class="control-label">{{key}}</label>' + 
    '<label class="control-label">{{key}}</label>' + 
     '<input type="text" ng-model="value" />'+ 
    '<button type="button" x-ng-click="cancel()">CANCEL</button>' + 
    '<button type="submit" x-ng-click="save()">SAVE</button></div>', 

    controller: function($scope, $element, $attrs, $location) {   
    $scope.save= function() { 
     console.log('from directive', $scope.key, $scope.value);  
     $scope.accept() 
    }; 
    } 
} 
}); 

jsFiddle

Answer 2

résolu le problème comme ci-dessous. C'était seulement pour injecter $ scope dans le contrôleur de la directive.

myApp.directive("updateCandidatePopup", function() { 
    return { 
     templateUrl : "UpdateCandidatePopup.html", 
     restrict: 'E', 
     controller: function ($scope) { 
     } 
    } 
});