0

I'm using an angular directive to generate a reusable template and show some data in it. The directive also has an ng-click that should take an object and pass it to the parent controller. I'm kind of stuck, not really sure how to pass that data from the directive controller to the scope of the parent controller. I read here but the circumstances are a bit different.

The js code of the directive:

angular.module("app")
    .directive('userData', function() {
    return {
        restrict: "E",
        templateUrl: "directives/userData/userData.html",
        scope: {
            userObj: "="
        },
        controller: function($scope){

        },
        link: function(scope, elements, attrs, controller){

        }
    }
});

And this is the directive html:

<div class="style" ng-click="displayFullDetails(userObj)">{{userObj.first_name}}</div>

Parent controller:

angular.module("app").controller("parentCtrl", ['$scope', function ($scope) {
    angular.element(document).ready(function () {
        getDataService.getJsonData().then(function (data) {
            $scope.users = data.data;    
        })

    });

}]);
Community
  • 1
  • 1
Alex
  • 1,982
  • 4
  • 37
  • 70
  • Can you post your parent controller as well? – Jeremy Wilken Jan 10 '17 at 21:01
  • @JeremyWilken just added the parent controller code. – Alex Jan 10 '17 at 21:03
  • You could add another scope param onClick: '&' to the child and pass in a function from the parent. Then in the child call the parent function with the object. – sledsworth Jan 10 '17 at 21:21
  • @sledsworth Im not sure I understand. – Alex Jan 10 '17 at 21:50
  • Just make the parent a directive as well. It's more modular, and then you can just use your child directives `require` option to require the parent and use it's functionality to give the parent the data. Look at the section "Directives that communicate" in these docs: https://docs.angularjs.org/guide/directive – Aaron Pool Jan 10 '17 at 22:40

0 Answers0