角度引导模式在输入点击时打开

在我的控制器中我有方法

• $scope.openJukeboxesModalToGroup -- 打开模式弹出窗口
• $scope.search Jukeboxes --- 在页面上搜索
• $scope.keyPressed -- 捕获按键

在带有表格的部分

<form class="form-inline" role="form" ng-submit="deadForm()">
    <div class="form-group">
         <button ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>
    </div>
    <div class="form-group">
        <input type="text" ng-model="jukeboxFilter" ng-keypress="keyPressed($event, 'search')" class="form-control" placeholder="search">
    </div>
    <button type="button" ng-click="searchJukeboxes()" class="btn btn-info"><span class="glyphicon glyphicon-search"></span></button>
    <button type="button" ng-click="resetFilter()" class="btn btn-info"><span class="glyphicon glyphicon-repeat"></span></button>
</form>

keyPressed 方法是

$scope.keyPressed = function($event, eventType) {
        $event.stopImmediatePropagation();
        if(eventType=='search') {
            if($event.which==13) {
                $scope.searchJukeboxes();
           }
       } 
 };

每当有人在文本栏中输入内容并单击输入时，我都会尝试开始搜索。但我也不知道 openJukeboxesModalToGroup() 方法也被调用。我试图通过调用 stop 事件传播、更改 openJukeboxesModalToGroup() 方法的名称来停止此操作。但没有任何作用。对此有任何帮助。

deadForm() 方法已实现，我在 Chrome 控制台中没有收到任何错误。

添加到您的按钮openJukeBoxesModalToGroup() type="button" to be:

<button type="button" ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>

问题是您没有提供类型，因此它将按钮归类为提交，在这种情况下 openJukeboxesModalToGroup() 将从您的输入中触发submit event.

当您在表单中按 Enter 键时，它将触发提交，我建议通过 ng-submit 指令将您的方法添加到表单本身，并使您的按钮成为提交...

<form class="form-inline" role="form" ng-submit="searchJukeboxes()">
    <div class="form-group">
         <button type="button" ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>
    </div>
    <div class="form-group">
        <input type="text" ng-model="jukeboxFilter" ng-keypress="keyPressed($event, 'search')" class="form-control" placeholder="search">
    </div>
    <button type="submit" ng-click="searchJukeboxes()" class="btn btn-info"><span class="glyphicon glyphicon-search"></span></button>
    <button type="button" ng-click="resetFilter()" class="btn btn-info"><span class="glyphicon glyphicon-repeat"></span></button>
</form>