Angular Material md-tabs在bootstrap模态渲染问题中

时间:2016-06-30 14:55:04

标签: angularjs bootstrap-modal angular-material

我在引导模态中使用了角度材质制表符。当我第一次打开模态时,只能看到三个选项卡中的第一个标签。当我点击该区域时,将出现另外两个标签。我猜测它与Html渲染有关,但我无法找到修复它的方法。有人可以提出解决方案吗?

顺便说一下,我使用bs-modal而非角度材质对话框的原因是因为我需要同时处理两个模态,这对于角度材质的对话框是不可能的。 / p>

这是我的代码:



<div id="settings-popup" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" ng-controller="SettingsController">
            <div class="modal-header text-center">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true"></button>
                <h2 class="buzz-blue">Setting</h2>
            </div>
            <div class="modal-body">
                <div class="row">
                    <!--BEGIN  tabs--->
                    <div class="col-md-12">
                        <md-tabs md-dynamic-height md-border-bottom>
                            <!--BEGIN  general settings--->
                            <md-tab>
                                <md-tab-label>General</md-tab-label>
                                <md-tab-body>
                                    <md-content class="md-padding">
                                        <!--content-->
                                    </md-content>
                                </md-tab-body>
                            </md-tab>
                            <!--END  general settings--->
                            <!--BEGIN  commercial settings--->
                            <md-tab>
                                <md-tab-label>Commercials</md-tab-label>
                                <md-tab-body>
                                    <md-content class="md-padding">
                                        <!--content-->
                                    </md-content>
                                </md-tab-body>
                            </md-tab>
                            <!--END commercial settings--->
                            <!--BEGIN running text settings--->
                            <md-tab>
                                <md-tab-label>Text</md-tab-label>
                                <md-tab-body>
                                    <md-content class="md-padding">
                                        <!--content-->
                                    </md-content>
                                </md-tab-body>
                            </md-tab>
                            <!--END running text settings--->
                        </md-tabs>
                    </div>
                    <!--END  tabs--->
                </div>
            </div>
        </div>
    </div>
</div>
&#13;
&#13;
&#13;

0 个答案:

没有答案