W jaki sposób tworzyć przy wykorzystaniu angulara dropdowny, które będą od siebie zależne? Stwórzmy prosty kontroler z przykładowymi danymi:
angular.module('shopApp').controller('ProductController', ['$scope', function($scope) { $scope.products = { 'Ice cream': { 'Chocolate', 'Vanilla' }, 'Pizza' : { 'Prosciutto', 'Americana' }, 'Cake': { 'Apple pie', 'Cheese' } }; }]);
Następnie przygotujmy widok html:
<script src="~/Scripts/angular/angular.js"></script> <script src="~/FiltersAngular/app-client.js"></script> <script src="~/FiltersAngular/productController.js"></script> <div ng-app="shopApp" ng-controller="ProductController"> <div class="form-group"> <select id="product" ng-model="types" ng-options="product for (product, type) in products"> <option value=''>Select product</option> </select> </div> <div class="form-group"> <select id="type" ng-disabled="!types" ng-model="type" ng-options="type for type in types"> <option value=''>Select type</option> </select> </div> </div> </div>
I to wszystko 🙂