我正在使用angular和Typescript创建一个登录页面。单击提交按钮时，我希望login控制器中的函数被触发，但是如果表单无效，则它将返回。
这是我第一次使用typescript，因此每次尝试输入if语句以检查表单是否无效时，都会引发错误Cannot read property '$invalid' of undefined。
这是html：
<form class="login-form" name="loginForm" ng-submit="vm.login()" novalidate>
<input type="email" name="email" placeholder="Email" required ng-model="vm.email" ng-class="{true: 'input-error'}[submitted && loginForm.email.$invalid]"/>
<input type="password" name="password" placeholder="Password" required ng-model="vm.password" ng-class="{true: 'input-error'}[submitted && loginForm.password.$invalid]"/>
<input type="submit" id="submit" ng-click="submitted=true"/>
</form>
这是编译的javascript：
var LoginModule;
(function (LoginModule) {
var LoginController = (function () {
function LoginController() {
}
LoginController.prototype.login = function () {
if(this.loginForm.$invalid) {
return;
}
console.log("Login was clicked, email is " + this.email + " and password is " + this.password);
};
return LoginController;
})();
LoginModule.LoginController = LoginController;
})(LoginModule || (LoginModule = {}));
angular.module('loginModule', []).controller('LoginController', LoginModule.LoginController);
似乎常见的问题是人们没有指定表单名称，但事实并非如此。有谁知道我为什么会收到这个错误？
您需要表单名称中的控制器别名
<form name="vm.loginForm" ng-submit="vm.login()" novalidate>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句