Angular Bootstrap ng-show 模态答案

【问题标题】：Angular Bootstrap ng-show modalAngular Bootstrap ng-show 模态
【发布时间】：2016-03-04 14:45:39
【问题描述】：

所以我想在属性触发器为 false 时显示引导模式，如下面的代码所示。基本上，如果在上面的控件中选择的福利的 hasFunds 属性为 false，则在选择该福利后显示模式（将在底部显示该代码），但如果为 true，则模式不会发生任何事情。

模态代码：

<!-- hasFunds Modal -->
<div class="modal fade" id="hasFundsModal" tabindex="-1" role="dialog" aria-labelledby="hasFundsModalLabel" aria-hidden="true" ng-show="benefit.hasFunds == false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                &times;
                <p>You have already claimed the full amount of your benefit, and so there may be no remaining funds to reimburse this claim. Are you sure you want to continue?</p>
            </div>
            <div class="modal-footer">
                <input type="button" class="naviaBtn naviaBlue" data-dismiss="modal" value="yes">
                <input type="button" class="naviaBtn naviaBlue" data-dismiss="modal" value="no">                                        
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

上面的控件有一个下拉选择器，其中包含触发真假的属性：

<div class="form-group col-md-6 naviaInp">
    <label for="beneSelect">Select your benefit</label>
    <select class="form-control" name="beneSelect" id="beneSelect" ng-model="benefit" ng-options="item.descr for item in claim" ng-required="true">
         <option value="">Please select a benefit....</option>
     </select>
    <input type="hidden" ng-model="claimInfo.benefitId" ng-change="{{ claimInfo.benefitId = benefit.id }}"/>
</div>
<div ng-show="claimForm.beneSelect.$dirty && claimForm.beneSelect.$error.required" class="errorContainer">
    <p class="claimError"><i class="fa fa-exclamation-circle"></i><span>this is a required field</span></p>
</div>

目前，没有模态显示真假。不能从 ng-show 触发模态吗？

非常感谢。

【问题讨论】：

如果某个表达式的计算结果为假，您是否要问如何使元素可见？
另外，您使用的是angular-ui.github.io/bootstrap/#/modal 吗？如果是这样，您的实施已关闭，您可能需要重新访问该链接。 ng-show 只是在满足表达式时使特定元素可见或不可见。在引导模式的情况下，需要做的不仅仅是让某些东西可见和不可见。
我遇到了和你一样的问题，最后从一个答案中得到了建议，只是把 HTML 模板放在我的主 HTML 中，使用 bootstrap css 进行设计。然后简单地将它放在一个 div 中并使用你的 ng-show ，就像你知道的那样：D 你可能已经看过它，但它工作得很好：stackoverflow.com/questions/33525361/…

标签： html angularjs twitter-bootstrap-3

【解决方案1】：

如果您使用的是 UI Bootstrap，请参阅有关 Modal 指令的文档：https://angular-ui.github.io/bootstrap/#/modal

您需要使用来自控制器的选项参数调用 $uibModal.open() 才能显示模式。

【讨论】：