Блог

Имя игрока предупреждается при нажатии кнопки submitPlayer, и мне также нужен соответствующий идентификатор игрока.

HTML

 <div class="row">
   <div class="input-field col s12">
     <input id="search" class="search nomargin" type="text" class="validate dark" ng-model="player">
     <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 player |filter:search">
             <li>{{eachPlayer.name}}</li>
           </ul>
        </div>
       </div>
     </div>

<div class="modalbuttongroup">
    <a href="" class="center waves-effect waves-light btn addplayer" ng-click="submitPlayer()">ADD PLAYER</a>
</div>
  

Модуль и контроллер

 var app = angular.module('playerapp', []);

app.controller("myController", function ($scope) {

    $scope.player=

    [
         {
          "id": "57f2ade2d9913939d0de4af8",
          "name": "A Team Player"

         },
         {
          "id": "57f3d03fd99139333880a2f8",
          "name": "B Team Player"
         },
         {
          "id": "57f3d05ad99139333880a2fa",
          "name": "C Team Player"
         },
         {
          "id": "57f3fff6d991394b3daa2d49",
          "name": "D Team Player"
         },
         {
          "id": "57f422d6d991390ea392762e",
          "name": "E Team Player"
         }
    ]

    $scope.submitPlayer = function() {
        alert(JSON.stringify($scope.player,null,5))
    };
});
  

Кроме того, я хочу, чтобы имя игрока отображалось в текстовом поле после выбора игрока, и при нажатии кнопки «добавить игрока» я хочу, чтобы идентификатор игрока был предупрежден.

Есть несколько проблем с вашим кодом,

(i) Вы используете player в качестве значения поиска, которое является коллекцией, поэтому его следует изменить.

   <input id="search" class="search nomargin" type="text" class="validate dark" ng-model="player.name">
  

и используется в качестве фильтра,

 <ul ng-repeat="eachPlayer in player |filter:player.name">
  

И нет способа выбрать проигрыватель с помощью вашего HTML-кода, поэтому я добавил кнопку радиовхода для выбора проигрывателя и присвоения переменной области видимости.

   <input type="radio" ng-model="selected" name="rdbRisk" ng-change="Assign(selected)" ng-value="eachPlayer" /> {{eachPlayer.name}}
  

ДЕМОНСТРАЦИЯ