AngularJS $scope 表单属性在 ng-submit 后未定义 [英] AngularJS $scope form attribute is undefined after ng-submit

查看:18
本文介绍了AngularJS $scope 表单属性在 ng-submit 后未定义的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我从 Angular 开始,但我仍然对语法和许多不同的编码方式感到非常困惑,以获得相同的结果.

我最近的问题是,当我提交表单时,我无法通过执行 $scope.attribute_name

来获取其值

HTML

<div ng-include src="'menu.html'"></div><div id="container" ng-controller="MainController"><div ui-view></div>

login.html(包含在路由中)

<input type="text" name='username' ng-model='username' required/><input type="text" name='password' ng-model='password' required/><button>Enviar</button></表单>

JS

 var app = angular.module('myApp', ['ui.router']);app.controller('MainController',['$scope',function($scope){$scope.login = 函数($event){警报($scope.username)$event.preventDefault();}}]);

总是提示未定义"我可以通过执行以下操作来获取值

$event.target.username

就像在 Meteor 上一样.

有什么想法吗?

@edit1

我添加了用户作为模型的对象

HTML

<input type="text" name='username' ng-model='user.username' required/><input type="text" name='password' ng-model='user.password' required/><button>Enviar</button></表单>

JS

app.controller('MainController',['$scope',function($scope){$scope.login = 函数($event){警报($scope.user.username)}}]);

我仍然得到 undefined

解决方案

<input type="text" name='username' ng-model='user.username' required/><input type="text" name='password' ng-model='user.password' required/><button>Enviar</button></表单>

在控制器中定义你的 $scope 如下.因为属性是在控制器初始化时注册到控制器的 $scope 中的.

app.controller('MainController',['$scope',function($scope){$scope.user={};//如果将点赋予变量,则定义 $scope 变量.$scope.login = 函数 (){警报($scope.user.username)}}]);

谢谢

I'm starting with Angular and I'm still very confused with syntax and the many different ways I can code to get the same result.

My latest problem is that when I submit a form, I can't get its values by doing $scope.attribute_name

HTML

<body ng-app="myApp">
        <div ng-include src="'menu.html'"></div>
        <div id="container" ng-controller="MainController">
            <div ui-view></div>
        </div>
    </div>

login.html (included by Route)

<form name="form" name='' action="" ng-submit='login($event)'>
    <input type="text" name='username' ng-model='username' required />
    <input type="text" name='password' ng-model='password' required />
    <button>Enviar</button>
</form>

JS

 var app = angular.module('myApp', ['ui.router']);
 app.controller('MainController',['$scope',function($scope){
        $scope.login = function ($event){
            alert($scope.username)
            $event.preventDefault();
        }
}]);

It always alert "undefined" I can get the values by doing the following

$event.target.username

Just like on Meteor.

Any ideas?

@edit1

I added user as the model's object

HTML

<form name="form" name='teste' action="" ng-submit='login($event)'>
    <input type="text" name='username' ng-model='user.username' required />
    <input type="text" name='password' ng-model='user.password' required />
    <button>Enviar</button>
</form>

JS

app.controller('MainController',['$scope',function($scope){
    $scope.login = function ($event){
        alert($scope.user.username)
}
}]);

I still get undefined though

解决方案

<form name="form" name='teste' action="" ng-submit='login()'>
    <input type="text" name='username' ng-model='user.username' required />
    <input type="text" name='password' ng-model='user.password' required />
    <button>Enviar</button>
</form>

define your $scope inside the controller as below. Because attributes are registered to the $scope of the controller when the controller initializes.

app.controller('MainController',['$scope',function($scope){
    $scope.user={}; //DEFINE $scope variable if dot is given to variable.
    $scope.login = function (){
        alert($scope.user.username)
}
}]);

Thanks

这篇关于AngularJS $scope 表单属性在 ng-submit 后未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆