2017-09-20 16 views
4

JSON入力を検証したいと思います。私はそれがカスタムディレクティブで行うことができますが、私は自分でそれを書くことはできません。今、私はそれを変えようとしています。jsonの入力検証とangularjs

私のhtml:

<div class="row"> 
    <div class="form-group col-xs-12"> 
     <label>Custom data:</label> 
     <textarea class="form-control" rows="10" name="customData" ng-model="application.customDataString" ng-change="validateJSON()"></textarea> 
    </div> 
</div> 

私のスクリプト

$scope.validateJSON = function() { 
     try { 
      JSON.parse($scope.application.customDataString); 
     } catch (e) { 
      $scope.applicationForm.customData.$setValidity = false; 
     } 
     return true; 
} 

が、私はエラーを取得しています:未定義

+1

チェックを使用すると、このhttps://stackoverflow.com/a/15447816/7333443 –

+0

はTypeError:。 はTypeError:プロパティを読み取ることができません$ scope.application.customDataStringの$ setValidityは今、私は別のエラーを取得する機能 – taskiukas

答えて

1

チェックこの

var app = angular.module('myApp', []); 
 
    app.controller('mainCtrl', function($scope) { 
 

 
     $scope.application = { 
 
     customDataString: "" 
 
     }; 
 

 
     $scope.validateJSON = function() { 
 

 
     try { 
 
      JSON.parse($scope.application.customDataString); 
 
      $scope.myForm.customData.$valid = true; 
 
      // or 
 
      // myForm.customData.$setValidity('valid', true); 
 
     } catch (e) { 
 
      $scope.myForm.customData.$valid = false; 
 
      // or 
 
      // myForm.customData.$setValidity('valid', false); 
 
     } 
 
     return true; 
 
     } 
 

 
    })
<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
    <script data-require="[email protected]" data-semver="1.6.5" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl"> 
 

 
    <div class="row" name="myForm" ng-form> 
 
    <div class="form-group col-xs-12"> 
 
     <label>Custom data:</label> 
 
     <textarea class="form-control" rows="10" name="customData" ng-form ng-model="application.customDataString" ng-change="validateJSON(myForm)"></textarea> 
 
    </div> 
 
    </div> 
 
    <br> 
 
    IS JSON VALID: {{myForm.customData.$valid}} 
 
</body> 
 

 
</html>
の '$ setValidityを' プロパティを読み取ることができません。

これもチェックしてください。 ng-formhttps://plnkr.co/edit/0BFO08fYU0op6z2W9Vh4?p=preview

+0

ではありません'$ setValidity'は未定義 – taskiukas

+0

ですが、私のフォームには他のフィールドがあり、フォームが有効な場合にのみ送信ボタンが有効になります。このソリューションでは、私はこの目標を達成することができません – taskiukas

+0

それはn個のフィールドに可能です。あなたが快適なng形式を感じていない場合。その後、通常の形式を使用します。 –