Checkbox value not updating when using directive in AngularJS

We are trying to implement a jQuery UI sortable list which contains a checkbox for each item. When this checkbox is changed, we need to update the model in the controller. Can someone tell me what we are doing wrong?

Screencast of issue: http://ift.tt/24Pkuzu

HTML

<ul class="ulCustomizeColumns" sortable-list sortable-list-items="amInboxCtrl.customizedColumnViewModels">
    <li class="customize-column-li" ng-repeat="item in amInboxCtrl.customizedColumnViewModels track by $index">
        <div sortable-list-item item="item" ng-model="item"></div>
    </li>
</ul>

Angular Controller

app.controller("ActivityManagementInboxCtrl", ["$http", "$window", "networkService",
    function ($http, $window, networkService) {
        var self = this;    
        self.customizedColumnViewModels = JSON.parse('@Html.Raw(Json.Encode(Model.InboxCustomizedColumns))');
        self.customizedColumnViewModels.sort(function (item1, item2) { return item1.DisplayOrder - item2.DisplayOrder; });    
        self.saveCustomizedColumns = function () {
            for (var i = 0; i < self.customizedColumnViewModels.length; i++) {
                self.customizedColumnViewModels[i].DisplayOrder = (i + 1);
            }
            var url = "" + '@Url.Action("SaveInboxCustomizedColumnsForUser", "ActivityManagement")';
            var data = {
                pCustomizedColumnsViewModel: self.customizedColumnViewModels
            };
            networkService.postDataAsAjax(url, data)
                .then(function (response) {
                    alert('done');
                });
        };
    }]);

Angular Directives

app.directive('sortableList', function () {
        return {
            restrict: "A",
            scope: {
                sortableListItems: '=',
            },
            link: function (scope, element, attrs) {
                $(element).sortable({
                    start: function (e, ui) {
                        ui.item.data('start', ui.item.index())
                    },
                    update: function (e, ui) {
                        debugger;
                        var start = ui.item.data('start');
                        var end = ui.item.index();
                        scope.sortableListItems.splice(end, 0, scope.sortableListItems.splice(start, 1)[0]);
                    }
                });
            }
        }
    });

    app.directive('sortableListItem', function () {
        return {
            restrict: "A",
            replace: true,
            scope: {
                item: '='
            },
            require: 'ngModel',
            template:
                '<div> \
                    <span><input type="checkbox" ng-model="item.IsDisplay" ng-checked="item.IsDisplay" /></span> \
                    <span> - </span> \
                    <span class="glyphicon glyphicon-move pull-right"></span> \
                </div>',
            link: function (scope, element, attrs, ngModelCtrl) {
                debugger;
                // TODO?
            }
        }
    });