Question

我已经创建了一个简单的form，正在验证。验证正常工作，但是验证完成后我试图调用方法，但是出现以下错误：

错误TypeError：this.nextForm不是函数

我的typescript代码如下：

onNavigate(direction) {
    // Fetch all the forms we want to apply custom Bootstrap validation styles to
    var forms = document.getElementsByClassName("needs-validation");
    // Loop over them and prevent submission
    var validation = Array.prototype.filter.call(forms, function(form) {
      form.addEventListener(
        "submit",
        function(event) {
          //Forward
          if (direction == "forward") {
            //Not correct
            if (form.checkValidity() === false) {
              event.preventDefault();
              event.stopPropagation();
              form.classList.add("was-validated");
            }
            //Corect
            else {
              form.classList.add("was-validated");
              this.nextForm();
            }
          }
        },
        false
      );
    });
  }

  nextForm() {
    this.router.navigate(["/id-application/welcome"]);
  }

Answer 1

使用箭头功能代替functions。

  var validation = Array.prototype.filter.call(forms,(form)=> { // use arrow function
      form.addEventListener(
        "submit",
        (event) => { // use arrow function
          //Forward
          if (direction == "forward") {
            //Not correct
            if (form.checkValidity() === false) {
              event.preventDefault();
              event.stopPropagation();
              form.classList.add("was-validated");
            }
            //Corect
            else {
              form.classList.add("was-validated");
              this.nextForm();
            }
          }
        },
        false
      );
    });
  }

这不是函数-Angular 5

1 个答案: