어떻게 angle2와 양방향 바인딩을 구현할 수 있습니까?

Question

저는 2에 완전히 새것입니다. 목록에서 입력 필드로 데이터를 바인딩하려고하는데, div가 있고 div 안에 ul과 하나가 있습니다. 입력 필드, 내가 뭘 하려는지 나열된 각 이름을 클릭 할 때 입력 데이터를 바인딩을 삽입하는 것입니다, 나는 단지 두 개의 입력 필드 (각 나열된 이름에 대해 두 개의 필드가 아닌 지금)를 갖고 싶습니다

여기

this is how it looks like

import { Component } from '@angular/core'; 
      import {MainService} from './main.service' 

      @Component({ 
       selector: 'my-app', 
       template:` 
       <div *ngFor="let user of data" (click)="message(user.name, user.number)"> 
        <ul> 
         <li>{{user.name}}</li> 
        </ul> 

        Name: <input type="text" [(ngModel)]="user.name"><br><br> 
        number: <input type="text" [(ngModel)]="user.number"> 
       </div> 

       `, 
       providers: [MainService] 
      }) 
      export class AppComponent { 
       data: any[]; 
       constructor(private mainservice: MainService){ 

       } 
       ngOnInit(){ 
        console.log("Test") 
        this.getUsers() 
       } 
       getUsers(){ 

        this.mainservice.getUsers().subscribe(
         data => { 
          console.log(data) 
          this.data = data; 
          }, 
         error => { 
          console.log(error) 

         } 
         ) 
       } 
       message(name, num){ 
        console.log(name + " " + num) 
       } 

      } 

Answer 1

는 동작 예이다. 나는 당신이 당신의 HTML을 잘못 생각했다고 생각한다. 표시/숨기기 벌금

@Component({ 
    selector: 'my-app', 
    template:` 
    <div *ngFor="let user of data" (click)="EditUser(user)"> 
     <ul> 
      <li>{{user.name}}</li> 
     </ul> 
    </div> 
    Name: <input type="text" [(ngModel)]="model.name"> 
    <br /> <br /> 
    Number: <input type="text" [(ngModel)]="model.num"> 
    `, 
    providers: [HTTP_PROVIDERS, MainService] 
}) 

https://plnkr.co/edit/x1leEPz4w2rzV1LQyVkB?p=preview