2014-07-17 2 views
0

웹 디자인에 익숙하지 않고 ng-model과 angularjs를 사용하여 입력 태그를 select 태그로 바인딩하려고합니다. 궁극적으로 사용자가 배열에서 요소를 선택하고 입력 태그의 자리 표시 자에 사용자가 선택한 값이 있어야합니다. 사용자는 입력 상자에 무언가를 입력 할 수 있으며 select 태그 안의 요소는 편집 기능과 마찬가지로 변경됩니다. 지금까지 내 코드가 어떻게 생겼는지 보여줍니다.select 태그 anglejs로 입력 바인딩하기

   <!-- Caregivers --> 
      <div class="form-group"> 
       <label for="caregivers">Caregivers</label> 
       <select class="form-control" id="caregivers"> 
        <option ng-repeat="info in infos.Caregivers" value="info.Name">{{info.Name}}</option> 
       </select> 

       <label for="careName">Name</label> 
       <input type="text" ng-model="info.Name" id="careName" placeholder="{{info.Name}}"> 

      </div> 

select 테이블은 잘 작동하지만 입력 상자 일 뿐이며 select는 바인딩되지 않습니다. 이 문제를 해결하는 방법에 대한 아이디어가 있습니까? 고급

편집에 감사 :

간단히 말하자면, 나는 NG-모델 또는 데이터 바인딩의 다른 유형을 사용하여 (NG-반복 사용)를 선택 태그를 입력 태그를 바인딩하는 방법을 알고 싶어요.

+1

당신이 바이올린을 추가 할 수 있습니까? – Raghavendra

+0

나는 어떻게하는지 모른다. 난 그냥 ng-repeat를 사용하는 select 태그로 입력 태그를 묶는 방법을 알고 싶다. 죄송합니다 질문이 명확하지 않은 경우 –

답변

2

나는 라고 생각합니다. 나는 당신이하고있는 일을 이해합니다. 옵션에 ng-repeat 대신 ng-options을 사용해야합니다. 그런 다음 텍스트 필드에 ng-model이라는 속성의 ng-model이있을 수 있습니다.

<select ng-model="selected_caregiver" 
     ng-options="caregiver as caregiver.Name for caregiver in info.Caregivers" 
     class="form-control" id="caregivers" /> 

<input type="text" 
     ng-model="selected_caregiver.Name" 
     id="careName" 
     placeholder="{{selected_caregiver.Name}}"> 

바이올린 : http://jsfiddle.net/fXs6e/

+0

멋지다, 작동하게. 너는 데이브 야, 고마워. –