Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have a navigation menu that I am building based off of a json object coming from an $resource. Sometimes I need to append to this list with new menu items from another $resource.

I want to bind the ng-show attribute of this navigation item to a check box.

How can I bind the checkbox to its corresponding item in the navigation?

Here is what builds the nav items.

<li ng-repeat="navItem in navigation track by $index" title="{{navItem.title}}">
     <div ng-show="navItem.visible" ng-disabled="navItem.disabled" ng-click='navigateTo(navItem.page)'>
           <i ng-class="navItem.iconClass"></i><span class="sr-only">{{navItem.title}}</span>
     </div>
</li>

Here is a sample of the json object I am currently using for the nav $resource.

{
 "title": "Contracts",
 "page": "contracts",
 "label": "Contracts",
 "disabled": true,
 "visible":true,
 "iconClass": "fa fa-file-o"
}

Here is the check box that may or may not need to be bound to the navigation item.

<div class="form-group" ng-repeat="service in service.exclusive">
   <input type="checkbox" id="service_{{service.id}}" ng-model="summary.exclusive[service.id]" value="{{service.id}}">
   <label for="service_{{service.id}}">{{service.name}}</label>
</div>

Here is the JSON for the service $resource.

"service":[
    "exclusive": [
        {
            "id": "screening",
            "name": "Screening",
            "hasForm": "true",
            "navigationButton": {
                "title": "Screening",
                "page": "screening",
                "label": "Screening",
                "disabled": true,
                "visible":false,
                "iconClass": "fa fa-pencil"
            }
        }
    ]
]

Here is how I am adding my new navigation item.

$scope.services.$promise.then(function (services) {
            angular.forEach(services.exclusive, function (currentObj) {
                if (currentObj.hasForm) {
                    $scope.navigation.$promise.then(function () {
                        $scope.navigation.splice(1, 0, currentObj.navigationButton);
                    });
                }
            })
        });
share|improve this question
    
you haven't identified what your problem is –  charlietfl Jul 4 at 17:30
    
@charlietfl I updated it to more clearly define my question. –  zmanc Jul 4 at 17:38
    
maybe a demo will help, hard to tell if you have separate controllers or what isn't working –  charlietfl Jul 4 at 17:59
    
One note in your JSON you have array with a key "exclusive", it should be an object. –  jcubic Jul 4 at 21:02

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.