5

私の問題の個別のケースを作成しました: http://plnkr.co/edit/6LXW5TG76LC9LNSrdpQC

孤立したケースのコードは次のとおりです。

<!DOCTYPE html>
<html ng-app="App">

    <head></head>

    <body ng-controller="ExampleController">
    
    <form name="form" ng-submit="submit()" novalidate>
        <input type="number" name="number" ng-model="number" required><br>
        <span ng-show="form.number.$error.required && form.number.$touched">Required<br></span>
        <span ng-show="form.number.$error.number">Not a number<br></span>
        <input type="submit">
    </form>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
    
    <script>
        
        var App = angular.module('App', []);
        
        App.controller('ExampleController', function($scope) {
        
        $scope.submit = function() {
            alert('send to server: ' + $scope.number);
        }
        
        });
        
        App.run();
        
    </script>
    </body>
</html>

基本的に、この例には数値フィールドが含まれており、その下には入力が無効 (空または数値ではない) 場合に表示されるエラー メッセージがあります。

ただし、フォームは引き続き送信されます。有効でない場合はフィールド値が「未定義」に設定されますが、サーバーに送信する前にフォームが有効かどうかを確認する方法をお勧めします (この例の警告ボックス)。

だから私の質問は - AngularJS では、フォームがコントローラー内から有効かどうかを確認する方法はありますか? または、フォームが無効な場合にフォームが送信されないようにする別の方法はありますか?

4

3 に答える 3

11

ng-submitに表情を変えたほうがいい

ng-submit="form.$valid && submit()"

angular ディレクティブ式の最適な使用。

于 2015-01-17T11:50:47.413 に答える
5

http://plnkr.co/edit/kqLUJpjt0n0anJxzm6en?p=preview

あなたが必要とするものは

if ($scope.form.$valid) {
    //submit to server
}

formフォーム名はどこですか

<form name="form"...
于 2015-01-17T11:04:50.517 に答える
1

ng-disabledディレクティブで試すことができます

      <button type="submit" ng-disabled='number==null'>Submit</button>

そうすれば、追加のコードを追加することを避けることができます

于 2015-01-17T11:49:21.167 に答える