Загрузка вложенных данных JSON в Angular JS на основе выбранных значений в каскадных выпадающих списках в ng-модальное всплывающее окно

Я пытаюсь создать кусок кода, используя Angular JS для файла JSON, имеющего три уровня вложенной структуры. Первый уровень - это тип автомобиля, второй - производитель и третий поставщик услуг. Файл JSON выглядит следующим образом, учитывая имя файла "types.json".

JSON Файл:

<!-------------------JSON file :"types.json"------------------------>
[
{"name":"Taxi","value":"taxi", <!--Level-1-->
    "manuf":[
        {"name":"Tata Indica", <!--Level-2-->
            "servprov":[
                {"name":"Service Provider Name 1", <!--Level-3-->
                 "arrival":"12Mins",
                 "fare":"$25",
                 "minfare":"$10",
                 "riders":"8 persons"   
                },

                {"name":"Service Provider Name 2", <!--Level-3-->
                 "arrival":"8Mins",
                 "fare":"$23",
                 "minfare":"$8",
                 "riders":"12 persons"

                }]          
        },

        {"name":"Mahindra Logan", <--Level-2-->
            "servprov":[
                {"name":"Service Provider Name 3", <!--Level-3-->
                 "arrival":"5Mins",
                 "fare":"$45",
                 "minfare":"$20",
                 "riders":"14 persons"  
                },

                {"name":"Service Provider Name 4", <!--Level-3-->
                 "arrival":"2Mins",
                 "fare":"$50",
                 "minfare":"$25",
                 "riders":"10 persons"

                }]
        }, 

        {"name":"Totota Etios",  <!--Level-2-->
            "servprov":[
                {"name":"Service Provider Name 5",  <!--Level-3-->
                 "arrival":"12Mins",
                 "fare":"$25",
                 "minfare":"$10",
                 "riders":"8 persons"   
                },

                {"name":"Service Provider Name 6",  <!--Level-3-->
                 "arrival":"8Mins",
                 "fare":"$23",
                 "minfare":"$8",
                 "riders":"12 persons"

                }]  
            }]
    },

        {"name":"SUV","value":"suv",  <!--Level-1-->
        "manuf": [
        {"name":"Hyundai Creta" , <!--Level-2-->
            "servprov":[
                {"name":"Service Provider Name 1", <!--Level-3-->
                 "arrival":"12Mins",
                 "fare":"$25",
                 "minfare":"$10",
                 "riders":"8 persons"   
                }, 
        {"name":"Renault Duster" , <!--Level-2-->
            "servprov":[
                {"name":"Service Provider Name 2", <!--Level-3-->
                 "arrival":"12Mins",
                 "fare":"$25",
                 "minfare":"$10",
                 "riders":"8 persons"   
                }, 
      {"name":"Mahindra XUV"}  <!--Level-2-->
      ]},
<!--service provider details are not provided for this-->

]
<!-------------------JSON file ------------------------>

Переходя к структуре HTML, первые два уровня помещаются в раскрывающийся список, который появляется на основе сделанного выбора. это было сделано с помощью ng-options, ng-model и ng-repeat. Проблема в том, как я могу получить информацию о данных уровня 3 (поставщик услуг) в модальном всплывающем меню на основе выбора, сделанного на уровне 2 (Производители), и при нажатии кнопки "Поставщик услуг". Тело показано ниже.

Структура HTML:

<!----------------------Body--------------------------->
<section class="col-lg-4" ng-controller="CarTypes">
    <div class="bgimage2">
        <div class="form-inline">
            <select name="type" class="form-control dropdown-toggle basic" ng-options="item as item.name for item in carTypes track by item.name"
                ng-model="manufTypes">
                <option value=''>Select Type</option>
                <option ng-repeat="data in carTypes" value="{{data.value}}">{{data.name}}</option>
            </select>
        </div>

        <div class="form-inline">
            <select class="form-control basic">   
                <option value=''>Select Manufacturer</option>                            
                <option ng-repeat="subCars in manufTypes.manuf">{{subCars.name}}</option>
            </select>
        </div>
        <button type="button" ng-click="submit()" class="button1 btn btn-warning">SERVICE PROVIDER</button>
    </div>
</section>
<!----------------------Body--------------------------->

Это контроллер, который используется с carTypes для автомобилей (уровень 1) и manufTypes для производителей (уровень 2). Какую переменную области действия я должен использовать для поставщика услуг. Пожалуйста, помогите.

контроллер:

<!-------------------Controller------------------------>
.controller('CarTypes', function ($scope, $http) {
    $http.get('types.json').success(function (response) {
        $scope.carTypes = response;
        $scope.manufTypes = $scope.carTypes;

    })
})
<!-------------------Controller------------------------>