Question

<label class="item item-input">
 <span class="input-label" id="depTime">Time</span>
 <input type="button" value="{{query.depTime}}" ng-click="openModal(2)" class="button"></input>
 <input type="button" value="{{query.depDate}}" ng-click="openModal(1)" class="button"></input>
</label>

openModal函数

$scope.openModal = function(index) {
        console.log("openModal" + index);
        if (index == 1) {
            $scope.dateModal.show();
        } else {
            $scope.timeModal.show();
        }
    };

http://codepen.io/anon/pen/wGMQJQ

问题是怎么造成的？

或者我应该使用/ a class ='button'/

感谢您的回复

Answer 1

出现此错误是因为当您调用openModal时，它总是获得index = 2的值，如果您为每个按钮使用不同的函数，那么它会更好

Answer 2

简短回答：

问题是您在标签内嵌套了两个输入控件。只需删除或替换输入周围的标签，一切都将正常工作

<body ng-controller="myCtrl">
  <span class="input-label" id="depTime">Time</span>
  <input type="button" value="{{query.depTime}}" ng-click="openModal(2)" class="button button-outline button-calm"></input>
  <input type="button" value="{{query.depDate}}" ng-click="openModal(1)" class="button button-outline button-calm"></input>

请参阅http://codepen.io/ryltsov/pen/aNaxja

请注意，我还修复了几个小错误（将模态模板dateModal更改为modal-1，并将此模态模板更新为数字1）

详细答案：

http://www.w3.org/TR/html-markup/label.html说：

label元素最多可包含一个后代输入元素，按钮元素，选择元素或textarea元素。

标签元素增加相关输入的命中区域。如果您有两个输入，当您单击标签文本中的任一个或上时，单击将由第一个输入处理。这就是为什么你总是在点击处理程序中得到2。

Ionic ng-click在<input type =“button”/>中调用相同的Modal

2 个答案: