Question

我正在使用angular。

创建统计页面

当我提交表单时，它会抛出错误无法读取属性＆＃39; $ invalid＆＃39;未定义的。

这是html：

<form name="statsForm" ng-submit="quoteRequestsKpi()" novalidate>
  <div class="row">

    <div class="col-lg-5">
      <div class="form-group" show-errors="{ showSuccess: true }">
        <label for="month">Month</label>
        <select name="month" id="month" class="form-control" required="required" ng-model="statsIn.month">
          <option value="0">January</option>
          <option value="1">February</option>
          ...
        </select>
      </div>
    </div>

    <div class="col-lg-5">
      <div class="form-group" show-errors="{ showSuccess: true }">
        <label for="year">Year</label>
        <select name="year" id="year" class="form-control" required="required" ng-model="statsIn.year">
          <option value="2016">2016</option>
          <option value="2017">2017</option>
        </select>
      </div>
    </div>

    <div class="col-lg-2">
      <div class="form-group">
        <label>&nbsp;</label>
        <input type="submit" class="btn btn-primary form-control" value="go" />
      </div>
    </div>

这是js代码：

controllers.controller('StatsController', [
'$scope', 'growl', 'appService',
function($scope, growl, appService) {
    var logger = log4javascript.getLogger('Stats');

    logger.debug('StatsController');

    /**
     */
    $scope.statsIn = {
        month : null,
        year : '2017'
    };

    /**
     */
    $scope.$on(EVENT_CURRENT_USER_SUCCESS, function() {
        logger.debug(EVENT_CURRENT_USER_SUCCESS);

        $scope.init();
    });

    /**
     */
    $scope.quoteRequestsKpi = function() {
        logger.debug('quoteRequestsKpi');

        $scope.$broadcast('show-errors-check-validity');

        if ($scope.statsForm.$invalid) {
            return;
        }

        appService.quoteRequestsKpi($scope.kpiIn).then(function(data) {
            if (data.status == SUCCESS) {

                $scope.quoteRequestKpis = data.quoteRequestKpis;
            } else {
                logger.warn('quoteRequestsKpi: ' + JSON.stringify(data));
            }
        });
    }

    $scope.ensureUserIsAuthenticated();
}]);

有谁知道我收到错误的原因？

Answer 1

因为您的表单在控制器中未定义。您必须在控制器中创建对表单的引用。

这可以通过使用controllerAs语法来完成：

e.g。

在视图中：

 <div ng-controller="StatsController as vm">
  <form name="vm.statsForm">
   <!--Input Fields...-->
  </form>
</div>

控制器：

    var vm = this;
    vm.statsForm// This is a reference to your form.

或者，如果您希望在控制器中注入$scope，则可以找到如何访问表单的答案here。

这是一个有效的plunker。

无法阅读财产＆＃39; $ invalid＆＃39;未定义的

1 个答案: