2016-10-16 2 views
0
내가 데이터가 필터 될 것이며 내가 라디오 버튼의 corrsponding 값을 선택할 때 검색 텍스트 필드를 선택하지만 그것이 늘 여기

AngularJS를 사용하여 materialize에서 ng-model 값을 얻는 방법은 무엇입니까?

<div class="row"> 
<div class="row"> 
    <div class="input-field col s12"> 
    <input id="search" class="search nomargin" type="text" class="validate dark" ng-model="search"> 
    <label for="search"><i class="fa fa-search" aria-hidden="true"></i> Search Player</label> 
</div> 
</div> 

    <div class="searchresultsbox z-depth-1"> 
     <div class="row nopad nomargin"> 
    <div class="col s12 nopad nomargin"> 
      <ul ng-repeat="eachPlayer in user |filter:search"> 
      <li><input name="rdbRisk" type="radio" id="rdbRisk" ng-change="Assign(selected)" ng-value="eachPlayer" ng-model="selected"/> 
    {{eachPlayer}} </li> 
      </ul> 
     </div> 
     </div> 
    </div> 
</div> 

<div class="modalbuttongroup"> 
    <a href="" class="center waves-effect waves-light btn addplayer" ng-click="submitPlayer(selected)"><i class="fa fa-check" aria-hidden="true"></i> ADD PLAYER</a> 
    <a href="" class="center waves-effect waves-light btn cancelbtn modal-close red"><i class="fa fa-times" aria-hidden="true"></i> CANCEL</a> 
</div> 

작업 검색에서 텍스트를 입력

내 JS 코드

입니다
app.controller("dobController", ["$scope", function($scope) { 
    $scope.selected; 
    $scope.user = 

     [{ 
    "id": "57f2ade2d9913939d0de4af8", 
    "firstName": "Sachin" 
    "lastName":"Tendulkar" 

     }, { 
    "id": "57f3d03fd99139333880a2f8", 
    "firstName": "Shane" 
    "lastName":"Warne" 
     }, { 
    "id": "57f3d05ad99139333880a2fa", 
    "firstName": "Virat" 
    "lastName":"Kohli" 
     }, { 
    "id": "57f3fff6d991394b3daa2d49", 
    "firstName": "Ricky" 
    "lastName":"Ponting" 
     }] 

    $scope.Assign = function(user) { 
     $scope.selected = user; 
    }; 
    $scope.submitPlayer = function(user) { 
     alert(JSON.stringify($scope.selected.id)) 
    }; 
    } 
]); 

플레이어가 선택되면 텍스트 필드에 플레이어 이름을 표시하고 '플레이어 추가'를 클릭하면 플레이어 ID를 알려주고 싶습니다.

답변

1

materialize를 사용하는 경우 특정 형식으로 양식을 디자인해야하며 동일한 형식의 각도 materialize js도 사용해야합니다.

<div ng-repeat="eachPlayer in player |filter:player.name"> 
    <p> 
     <input type="radio" id="test1" ng-model="selected" ng-change="Assign(selected)" ng-value="eachPlayer" /> {{eachPlayer.name}} {{selected}} 
     <label for="test1">{{eachPlayer.name}}</label> 
    </p> 

DEMO

+0

항상 내가 세 번째 라디오 버튼을 선택한 경우에만 데모를 확인 첫 번째 라디오 버튼 선택하지만이 구체화 된 SS 만 처음 –

+0

@AraviS의 문제를 선택합니다 – Sajeetharan

+0

하지만, ID를 얻는 것은 그것에 대한 어떤 구제 수단이라도 틀린가? –

관련 문제