Ng-submit 和 ng-click 在离子 iPhone 应用程序中多次触发答案

【问题标题】：Ng-submit and ng-click fires many times i ionic iPhone appNg-submit 和 ng-click 在离子 iPhone 应用程序中多次触发
【发布时间】：2015-07-24 13:37:29
【问题描述】：

我正在试用 ionic 框架，它看起来非常不错。但是，我在提交表单时遇到了问题：表单触发了两次。首先是按下提交按钮时，然后如果我只是点击屏幕上的任意位置。这发生在 xcode 模拟器和我的 iphone 4gs 上。

这就是我所做的：我使用以下命令安装 sidemenu 模板：ionic start myApp sidemenu。

然后我只需将此表单粘贴到制表符模板中：

  <form ng-submit="createTask(task)">
        <div class="list">
            <label class="item item-input">
                <input type="text" placeholder="What do you need to do?" ng-model="task.title">
            </label>
        </div>
        <div class="padding">
            <button type="submit" class="button button-block button-positive">Create Task</button>

        </div>
    </form>

在我的控制器中，我只有：

 $scope.createTask = function(task) {

        alert(task.title);

    };

这是我对起始模板所做的唯一更改，但表单仍然提交了两次。我不知道为什么。非常感谢这里的一些指导！

【问题讨论】：

我也遇到了同样的问题...有人找到解决方案了吗？

标签： iphone angularjs ionic-framework

【解决方案1】：

从按钮中删除 type="submit" 并从表单中删除 ng-submit 并将其移动为 ng-click 按钮本身。

所以你应该以

结束

<button ng-click(createTask) class="...">Create Task</button>

【讨论】：

【解决方案2】：

这可能是因为每当调用 ng-click 时，都会进行两次调用，一个由 angular 调用，另一个由 ionic 调用。当您使用 ionic 项目时，离子和 Angular 是一个捆绑包。

您可以尝试其中一种方法。

1) 在您的 index.html 中使用 ionic 和 angular javascript 分开

而不是包括（一个javascript文件中的离子和角度）

ionic.bundle.min.js

用作

ionic.min.js

angular.min.js

2) 或者，您可以创建自己的指令，而不是像下面这样的 ng-click。

在此之前包含 angular-touch.js 并将 ngTouch 作为模块注入 app.js 中的应用程序

app.directive('myclick', function() {

return function(scope, element, attrs) {

    element.bind('touchstart click', function(event) {

        event.preventDefault();
        event.stopPropagation();

        scope.$apply(attrs['myclick']);
    });
};

});

希望这会有所帮助。

【讨论】：

【解决方案3】：

在你的控制器中

$scope.createTask = function(task) {
    alert(task.title);
};

将$scope.task= {}; 添加到初始化中

【讨论】：