Ionic Modal Pass Data

ionic-v1
1

I am wonder if someone call assist with my issue. So basically my app has a category select and a sub category select based on the category that was selected. This works perfectly with Ionic popup, however when i change to use a Ionic modal the data fails to pass through to the modals and the sub category is always empty.

What am i missing here?

Code below:
HTML Below

<script id="categoryModal.html" type="text/ng-template">
        <ion-modal-view>
            <ion-header-bar align-title="center" class="bar-energized nav-title-slide-ios7">
                <h1 class = "title">Category Select</h1>
                <div class="buttons">
                    <button style="font-size:17px; color:#fff; font-weight:500" class="button button-clear button-positive" ng-click = "closecategoryModal()">Done</button>
                </div>
            </ion-header-bar>
            <ion-content>
                <ion-list>
                    <ion-checkbox ng-model="CategoryList[$index].value" ng-true-value='true' ng-false-value='false' ng-repeat="x in CategoryList">
                        <span ng-bind-html="x.Name"></span>
                    </ion-checkbox>
                </ion-list>
            </ion-content>
        </ion-modal-view>
    </script>

    <script id="subcategoryModal.html" type="text/ng-template">
        <ion-modal-view>
            <ion-header-bar align-title="center" class="bar-energized nav-title-slide-ios7">
                <h1 class = "title">Sub-Category Select</h1>
                <div class="buttons">
                    <button style="font-size:17px; color:#fff; font-weight:500" class="button button-clear button-positive" ng-click = "closesubcategoryModal()">Done</button>
                </div>
            </ion-header-bar>
            <ion-content>
                <ion-list>
                    <ion-checkbox ng-model="SubCategoryList[$index].value" ng-true-value='true' ng-false-value='false' ng-repeat="x in SubCategoryList">
                        <span ng-bind-html="x.Name"></span>
                    </ion-checkbox>
                </ion-list>
            </ion-content>
        </ion-modal-view>
    </script>

JS Below

    $scope.CategoryList = [];
    $scope.SubCategoryList = [];
$ionicModal.fromTemplateUrl('categoryModal.html', {
            scope: $scope,
            animation: 'slide-in-up'
        }).then(function (modal) {
            $scope.categorymodal = modal;
        });

        $scope.opencategoryModal = function () {
            $scope.categorymodal.show();
        };

        $scope.closecategoryModal = function () {
            $scope.categorymodal.hide();
            $scope.BindSubCategoryBasedOnCategory();
            console.log($scope.SubCategoryList[0]);
            console.log($scope.CategoryList[1].value);
        };

        $ionicModal.fromTemplateUrl('subcategoryModal.html', {
            scope: $scope,
            animation: 'slide-in-up'
        }).then(function (modal) {
            $scope.subcategorymodal = modal;
        });

        $scope.opensubcategoryModal = function () {
            $scope.subcategorymodal.show();
        };

        $scope.closesubcategoryModal = function () {
            $scope.subcategorymodal.hide();
        };

        $scope.$on('$destroy', function () {
            $scope.categorymodal.remove();
            $scope.subcategorymodal.remove();
        });

    $scope.GetSelectedCategoryIds = function () {
            $scope.selCatIds = [];
            for (i = 0; i < $scope.CategoryList.length; i++) {
                $scope.cat = $scope.CategoryList[i];
                if ($scope.cat.value == 'true') {
                    $scope.selCatIds.push($scope.cat.id);
                    console.log($scope.CategoryList[i].value);
                }
            }
            console.log($scope.selCatIds);
            return $scope.selCatIds;
        }

    $scope.BindSubCategoryBasedOnCategory = function () {
            $scope.arrSelCategoryIds = $scope.GetSelectedCategoryIds();
            if ($scope.arrSelCategoryIds.length > 0) {
                $scope.SubCategoryList = [];
                $scope.arrAlertCat = null;
                if ($scope.jobAlertDetail.Categoryids != null) {
                    $scope.arrAlertCat = $scope.jobAlertDetail.Categoryids.split(',');
                }
                for (i = 0; i < $scope.list_categories.length; i++) {
                    $scope.cat = $scope.list_categories[i];
                    if ($scope.cat.parent != "0" && $scope.arrSelCategoryIds.includes($scope.cat.parent)) {
                        $scope.alertCat = {};

                        if ($scope.arrAlertCat != null && $scope.arrAlertCat.includes($scope.cat.term_id)) {
                            $scope.alertCat = {
                                value: 'true',
                                Name: $scope.cat.name,
                                id: $scope.cat.term_id
                            };
                        } else {
                            $scope.alertCat = {
                                value: 'false',
                                Name: $scope.cat.name,
                                id: $scope.cat.term_id
                            };
                        }
                        $scope.SubCategoryList.push($scope.alertCat);
                    }
                }
            }
        }