如何将范围变量值作为FormName传递给ng-click param并获取FormName。$ valid和FormName。$ dirty view angularjs

时间:2016-07-07 16:58:55

标签: javascript angularjs asp.net-mvc-4

如何将范围变量作为ng-click参数的'FormName'传递给获取FormName。$ valid和FormName。$ dirty in view angularjs。

示例:

var myApp = angular.module('myApp', []);

myApp.controller('Main', ['$scope',function($scope){
    $scope.FormName = 'FormNameValidation';
    $scope.showFormValidation = function(statusValid, statusDirty)
    {
     $scope.FormNameValidationStatus = statusValid;
     $scope.FormNameDirtyStatus = statusDirty;
    }

}]);

<form name="FormName" novalidate>
    <div ng-app='myApp' ng-controller="Main">
        <button type="button" ng-click="showFormValidation(FormName.$valid, FormName.$dirty)">Click</button>
        {{FormNameValidationStatus}}
        {{FormNameDirtyStatus}}
    </div>
</form>

输出:undefined undefined

1 个答案:

答案 0 :(得分:0)

问题是表单元素没有包含在定义ngApp指令的元素中。如果您重新排列元素,以便表单是具有ng-app属性的div的后代,您应该得到您想要的内容

&#13;
&#13;
  var myApp = angular.module('myApp', []);

  myApp.controller('Main', ['$scope',
    function($scope) {
      $scope.FormName = 'FormNameValidation';
      $scope.showFormValidation = function(statusValid, statusDirty) {
        $scope.FormNameValidationStatus = statusValid;
        $scope.FormNameDirtyStatus = statusDirty;
      }

    }
  ]);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
  <h1>Form State</h1>
  <div ng-app="myApp" ng-controller="Main">
    <form name="FormName" novalidate="">
      <button type="button" ng-click="showFormValidation(FormName.$valid, FormName.$dirty)">Click</button>
      {{FormNameValidationStatus}} {{FormNameDirtyStatus}}
    </form>
  </div>
</body>
</html>
&#13;
&#13;
&#13;