GaramX

이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.

====== Two Way Binding ======

<code html>
<input [(ngModel)]="name" type='text'>
</code>

ngModel를 사용하려면 **app.module.ts**파일에 **FormsModule**를 포함시켜야 합니다.
<code typescript>
import { FormsModule } from '@angular/forms'
</code>

<code typescript login.component.ts>
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-login',
  //templateUrl: './login.component.html',
  template: `<div>
  <input [(ngModel)]="login_id" type="text">
  <input [(ngModel)]="password" type="password" (keyup.enter)="login()">
  <button (click)="login()" id="btnSave">로그인</button>
</div>
  `,
  styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {
  login_id: string;
  password: string;
  constructor() { }

  ngOnInit(): void {
  }

  login(){
    console.log('login_id:', this.login_id, this.password)
  }

}
</code>

GaramX

사용자 도구

사이트 도구

문서 도구