1

我是 AngularJs 的新手,我的代码有问题。

目前我的 HTML 看起来像:

<div class="wizardContainer">
<wizard on-finish="finishedWizard()">
    <wz-step title="1">
        <h1>Question 1</h1>
        <p>How old are you?</p>
        <form name="age_form" novalidate ng-submit="signupForm()">
            <fieldset>
                <input type="text" name="age" ng-model="user.age"
                       ng-minlength=1 required>

                <div class="error-container"
                     ng-show="age_form.age.$invalid && age_form.submitted">
                    <small class="error"
                           ng-show="age_form.age.$error.required">
                        Please fill in the field
                    </small>
                    <small class="error"
                           ng-show="age_form.age.$error.minlength">
                        Please fill in mininum 1 number
                    </small>
                </div>
                <button type="submit" class="btn btn-default full-width">go on</span></button>
            </fieldset>
        </form>
    </wz-step>
    <wz-step title="2">
        <h1>Question 2</h1>
        <p>How are you?</p>
    </wz-step>
</wizard>

我的控制器看起来像:

angular.module('ngBoilerplate.about', [
    'ui.router',
    'placeholders',
    'ui.bootstrap',
    'mgo-angular-wizard'
])

.config(function config($stateProvider) {
    $stateProvider.state('about', {
        url: '/about',
        views: {
            "main": {
                controller: 'AboutCtrl',
                templateUrl: 'about/about.tpl.html'
            }
        },
        data: { pageTitle: 'What is It?' }
    });
})

.controller('AboutCtrl', function AboutCtrl($scope) {

    $scope.user = {};

    $scope.submitted = false;

    $scope.signupForm = function() {
      if ($scope.age_form.$valid) {
          window.location="#/about";
      } else {
        $scope.age_form.submitted = true;
      }
    };
});

如果我在向导的第一步中单击提交按钮,我会在控制台中收到错误消息:$scope.age_form is undefined

有人可以帮我解决这个问题吗?

非常感谢你的回答!

4

1 回答 1

0

角度向导项目目前存在范围问题。我能够在下面的帖子中解决它。

试图让表单验证与 Angular 向导一起使用
我正在尝试让表单验证与 Angular 向导一起使用

但是,这是一个临时修复。该项目肯定需要返工。

这一切都与github上的这个问题有关。

步骤验证?!
https://github.com/mgonto/angular-wizard/issues/41

于 2014-10-05T19:57:41.703 回答