Question

我正在尝试创建两个带主题的下拉菜单，另一个带有视频的下拉菜单。视频将根据主题进行过滤。提前感谢您的帮助。

        <md-input-container flex>
            <label>Topic</label>
            <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-select>
        </md-input-container>
        <md-input-container flex>
            <label>Video</label>
            <md-select ng-model="selected.video" required >
                <md-option ng-repeat="video in videos" value="{{video.VideoID}}">{{video.Name}}</md-option>
            </md-select>
        </md-input-container>

这是控制器

function getVideosByTopicId(topicId) {
    return $http.post(baseUrl + 'Test/getVideosByTopicId', topicId).then(function (response) {
        return $.parseJSON(response.data);
    });
}

Answer 1

你可以这样做，

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

<强> DEMO

角度级联下拉列表

1 个答案: