如何从ngModel获取价值?

时间:2017-03-15 10:37:44

标签: angular

我有这样的表格:

    <form id="login-form" class="text-left" (ngSubmit)="submitLogin()">
      <div class="login-form-main-message"></div>
                <div class="main-login-form">
                    <div class="login-group">
                        <div class="form-group">
                            <label for="lg_username" class="sr-only">Username</label>
                            <input type="text" class="form-control" id="lg_username" name="lg_username" placeholder="username"  [(ngModel)]="username">
                        </div>
                        <div class="form-group">
                            <label for="lg_password" class="sr-only">Password</label>
                            <input type="password" class="form-control" id="lg_password" name="lg_password" placeholder="password"  [(ngModel)]="password">
                        </div>
                    </div>
                    <button type="submit" class="login-button"><i class="fa fa-chevron-right" ></i>LOGIN</button>
     </div>
</form>

在组件中我有这个:

  submitLogin(){
          // Variable to hold a reference of addComment/updateComment

      }

我有登录组件:

import {Component, EventEmitter, Input, OnChanges} from '@angular/core';
import {Observable} from 'rxjs/Rx';
import { LoginService } from '../services/login.service';
import { Login } from '../model/login'
@Component({
    selector: 'login',
    templateUrl: 'login-form',

})
export class LoginComponent {
  // Constructor with injected service
      constructor(
          private commentService: LoginService
          ){}
      // Local properties
      private model = new Login('', '');

      submitLogin(){
          // Variable to hold a reference of addComment/updateComment
            alert('aaaa');
      }


}

现在我想要的是从ngModel获取submitLogin()中的值,然后处理我想要的值。有什么建议吗?

2 个答案:

答案 0 :(得分:4)

您可以从表单中获取值:

<form #form="ngForm" id="login-form" class="text-left" (ngSubmit)="submitLogin(form.value)">

答案 1 :(得分:0)

您可以使用引用变量来访问ngModel

<input type="text" [(ngModel)]="..." #name="ngModel">

然后使用此变量作为模板。

此处有更多详情:https://angular.io/docs/ts/latest/guide/template-syntax.html#ref-vars