AngularJS:在表单外调用 ng-submit 事件 [英] AngularJS: Call the ng-submit event outside the form

问题描述

我是 AngularJS 中的一条鱼，我有这个场景.

<输入类型=文本"></表单><button type="submit">submit</button>

在正常情况下，AngularJS 提供 ng-submit 指令作为表单中的一个属性，但我需要在外部调用它.

那么，有人遇到过同样的问题吗?如果是，你做了什么?

解决方案

请用 ng-controller 包围你的代码，并在 范围外使用 ng-click 按钮.

我为您制作了一个关于 jsfiddle 的示例...试试看:

http://jsfiddle.net/xKkvj/2/

<div ng-controller="Ctrl"><form ng-submit="submit()">输入文本并按回车键:<input type="text" ng-model="text" name="text"/><input type="submit" id="submit" value="Submit"/><pre>list={{list}}</pre></表单><button ng-click="submit()">提交 2</button>

使用js:

function Ctrl($scope) {$scope.list = [];$scope.text = '你好';$scope.submit = 函数 () {如果($scope.text){$scope.list.push($scope.text);$scope.text = '';}};}

I'm a fish in AngularJS and I have this scenario.

<form>
    <input type="text">
</form>
<button type="submit">submit</button>

In normal ways AngularJS provides the ng-submit directive to work as an attribute in the form but I need to call it outside.

So, someone has experienced the same problem? If yes, what you did?

解决方案

Please, surround your code with a ng-controller, and use ng-click on buttons out of scope of <form>.

I make a sample on jsfiddle for you... try it:

http://jsfiddle.net/xKkvj/2/

<div ng-app>
    <div ng-controller="Ctrl">
        <form ng-submit="submit()">Enter text and hit enter:
            <input type="text" ng-model="text" name="text" />
            <input type="submit" id="submit" value="Submit" /> <pre>list={{list}}</pre>
        </form>
        <button ng-click="submit()">Submit 2</button>
    </div>
</div>

with js:

function Ctrl($scope) {
    $scope.list = [];
    $scope.text = 'hello';
    $scope.submit = function () {
        if ($scope.text) {
            $scope.list.push($scope.text);
            $scope.text = '';
        }
    };
}

这篇关于AngularJS:在表单外调用 ng-submit 事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！