user6934713 user6934713 - 1 year ago 115
AngularJS Question

Angular cascading dropdowns

I am trying to create two drop downs one with topic and the other one with videos. The videos one is going to be filter by the topics. Thank you in advance for the help.

<md-input-container flex>
<md-select ng-model="selected.topic" required ng-change="getVideosByTopicId(selected.topic)">
<md-option ng-repeat="topic in topics" value="{{topic.TopicID}}">{{topic.TopicName}}</md-option>
<md-input-container flex>
<md-select ng-model="" required >
<md-option ng-repeat="video in videos" value="{{video.VideoID}}">{{video.Name}}</md-option>

And this is the controller

function getVideosByTopicId(topicId) {
return $ + 'Test/getVideosByTopicId', topicId).then(function (response) {
return $.parseJSON(;

Answer Source

You can do this,

<md-select ng-model="type" >
    <md-option ng-value="k" data-ng-repeat="(k,v) in videos">{{ k }}</md-option>
    <md-select ng-model="metrics" >
   <md-option ng-value="t" data-ng-repeat="t in level2">{{ t }}</md-option>


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download