Javascript Angular JS-引导模式输入键有两个按钮，只有一个可见

我有一个模式屏幕，允许用户创建新出版物并编辑现有出版物：

<div class="modal-content">
    <form role="form">
    <div class="modal-header ng-scope">
        <h3 class="modal-title">{{ items.ui.header }}</h3>
    </div>
    <div class="modal-body ng-scope">
        <div class="row">
            <div class="col-xs-12">
                <input type="hidden" name="publicationId" ng-model="items.publication.id" />
                <label for="publicationTitle">{{ items.ui.label }}</label>
                <input type="text" class="form-control" id="publicationTitle" name="publicationTitle" ng-model="items.publication.title"  />
            </div>

        </div>
    </div>
    <div class="modal-footer ng-scope">
        <button class="btn btn-primary" ng-click="new()" ng-show="items.ui.modalType=='new'" ng-enter="new();">{{ items.ui.action }}</button>
        <button class="btn btn-info" ng-click="edit()" ng-show="items.ui.modalType=='edit'"ng-enter="edit();">{{ items.ui.action }}</button>
        <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
        <button class="btn btn-danger pull-left" ng-click="delete()" ng-show="items.ui.modalType=='edit'"><span class="glyphicon glyphicon-trash"></span></button>
    </div>
    </form>
</div>

{{items.ui.header}
{{items.ui.label}
{{items.ui.action}
{{items.ui.action}
取消

其中，在任何给定时间，仅显示两个按钮中的一个按钮

new（）

和

edit（）

。但是，当我使用

ENTER

键提交表单时，它有时会触发错误的操作。事实上，它会触发模式中的上一个操作，即使按钮未显示。

---

有什么更好的方法可以实现这一点呢？

原因是ng show和ng hide将显示设置为none。表示元素仍然存在于DOM上

为了解决这个问题，可以改用ng if，它将从DOM中删除元素或重新创建元素

---

你可以使用<代码> ng，如果而不是<代码> ng显示：在这种情况下，如果表达式为false，角度将不会创建DOM元素。