CODEWITHSUNDEEP
javascriptangularjs
FreakProgrammer
FreakProgrammer

Reputation: 93

Access ng-model from one directive to other directive

so i have that template in first directive

<tr ng-repeat="node in myprops.List">
        <td>{{node.startDate | date: 'yyyy-MM-dd'}}</td>
        <td>{{node.endDate | date: 'yyyy-MM-dd'}}</td>
        <td>{{node.workInHours }}</td>
        <td><label type="button" style="cursor:pointer" ng-click="setIndex($index)" data-toggle="modal" data-target="#{{myprops.id}}">edit</label></td>
        <td><input type="checkbox" ng-click="onClick()" ng-model="node.selected" ></td>
    </tr>

and in that directive i have controller who has function setIndex(index).. so when i click the button its open that modal 

<form name="myForm">
                        <md-datepicker ng-model="sDate" md-placeholder="Enter date"></md-datepicker>
                        <md-datepicker ng-model="eDate" md-placeholder="Enter date"></md-datepicker>
                        <input type="number" ng-model="hours"  required>
                    </form>

and that modal is in other directive template.. so i need when i click the button and open modal that what is in array with that $index to be add on ng-model on model ..sDate..eDate and hours ... in short i need to access that ng model which is in one directive template from another controller in other directive

Upvotes: 0

Views: 44

Answers (1)

RydelW
RydelW

Reputation: 126

You should pass model object from main controller to the modal directive controller, then after modifying it by actions in modal returning this object to previous controller and assign new data from modal

E.g (ui.bootstrap):

function MainController($scope, $modal) {
  $scope.model = {};

  $scope.onClick = function () {
    var modalInstance = $modal.open({
     // params
     controller: ModalController;
     resolve: {data: function() {return $scope.model}}
    });
    modalInstance.result.then(function (data) {
      $scope.model = data
    })
  }
}

function ModalController($scope, $modalInstance, data) {
  // actions
  $scope.data = data;
  $scope.saveForm = function () {
    $modalInstance.close($scope.data)
  }
}

Upvotes: 1

Related Questions