CODEWITHSUNDEEP
angularjs
helion3
helion3

Reputation: 37431

Sharing scope/data between directive controller and a child directive

I'm opening a custom modal (using angular-bootstrap):

$modal.open({
    // templateUrl, etc
    controller: 'DemoModalController'
});

It has form handling methods and data loaded to its controller/scope:

modals.controller('DemoModalController', ['$scope', function($scope) {

   $scope.formData = {};
});

The template of this modal has a <div location-field> element, it's a custom field I've defined as a directive.

    locationField.directive('locationField', function() {
        return {
            restrict: 'A',
            templateUrl: 'location-field.html',
            controller: 'LocationFieldController'
        };
    });

I'm trying to find the best solution for accessing data in the form fields inside the locationField directive.

If there's an element inside <input type="text" ng-model="location.x">, I want the location to be accessible to the DemoModalController

I've tried setting the directive to scope: false, scope: { location: '=' } (and setting a location object in the controller), and also scope: { location: '@' } but none seem to work.

The only way that works so far is calling $scope.$$childTrail.location from the modal controller scope.

Upvotes: 1

Views: 385

Answers (1)

batmaniac7
batmaniac7

Reputation: 422

Can you try passing the field like: 

<div location = "{{location}}">

Upvotes: 1

Related Questions