javascript - applying changes to a model in angular.js that was fetched by scope.$apply -

i have directive in angularjs fetches array so:

var current_element_list = scope.$apply($(this).attr('sortable-model')); 

the rest of code looks this:

//in controller $scope.project.elements = [];  //in html <customdirective sortable-model='project.elements'> 

i thought scope.$apply return reference $scope.project.elements array, changes made in directive retained in model. however, not seem case, changes made array not saved. there anyway can save changes array in root scope here obtained via sortable-model attribute?

when want bi-directional binding between directive , controller scope, should use scope property when defining directive.

var app = angular.module("app", []);  app.controller("ctrl", function ($scope) {     $scope.project = {         elements: [1, 2, 3]     }; });  app.directive("customdirective", function () {     return {         restrict: "e",         scope: {             sortablemodel: "="         },         link: function (scope, element, attrs) {             // access controller's scope.project.elements here scope.sortablemodel             console.log(scope.sortablemodel);              // changes scope.sortablemodel affect controller's scope.project.elements             scope.sortablemodel.push(4);         }     }; }); 

see working fiddle in action.