【问题标题】:How can I populate a form from an ng-repeat item如何从 ng-repeat 项目填充表单
【发布时间】:2016-03-20 19:49:23
【问题描述】:

我希望能够单击表格中的 ng-repeat 行并从行数据中填充表单。我的 editplayer() 函数中需要什么?

这是表格和表格

<table class="table table-condensed table-striped table-responsive">
    <thead>
        <th></th>
        <th>Name</th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
    </thead>
    <tbody>
       <tr ng-repeat="player in players" ng-model="players">
        <td><input type="checkbox" name="" id=""></td>
        <td ng-click="editPlayer($index)">{{ player.name }}</td>
        <td><i class="fa fa-paper-plane"></i></td>
        <td><i class="fa fa-comment"></i></td>
        <td><i class="fa fa-phone"></i></td>
        <td><i class="fa fa-edit"></i></td>
        </tr>
    </tbody>
</table>

<form id="playerForm" name="playerForm" ng-model="thisplayer" novalidate>
  <input type="text" id="id" name="id"  placeholder="id" class="form-control" ng-model="player.id" ></input>
  <div class="form-group">
    <input type="text" id="player" name="name"  required placeholder="Name" class="form-control" ng-model="player.name" ng-required="true" >{{ player.name }}</input>
    <span ng-show="playerForm.name.$touched && playerForm.newplayer.name.$invalid">The name is required.</span>
  </div>
  <div class="form-group">
    <input type="email" id="email"  required Placeholder="Email" class="form-control" ng-model="player.email">{{ player.email }}    </input>
  </div>
  <div class="form-group">
    <input type="text" id="tel"  required Placeholder="Tel" class="form-control" ng-model="player.tel">{{ player.tel }}</input>
  </div>
  <div class="form-group">
    <input type="text" id="initials"  required Placeholder="Initials" class="form-control" ng-model="player.initials">{{ player.initials }}</input>
  </div>
  <div class="form-group">
    <button id="btnPlayerAdd" name="btnPlayerAdd" class="btn btn-success" type="submit" ng-click="addPlayer($event)" ng-show="!isUpdate">Add player</button>
    <button id="btnPlayerSave" name="btnPlayerSave" class="btn btn-success" type="submit" ng-click="updatePlayer($event)" ng-show="isUpdate">Update player</button>
  </div>
</form>

【问题讨论】:

  • 你的控制器在哪里?这就是你定义editPlayerplayers等的地方...

标签: javascript angularjs firebase-realtime-database


【解决方案1】:

你可以按照这个:

  <tr ng-repeat="player in players">
        <td>{{player.Name}}</td>
        <td><input type="button" value="Edit" class="btn btn-info btn-sm" ng-click="editplayer(player)" /></td>

    </tr>

在 editplayer() 中:

$scope.editplayer= function (player) {
        $scope.player.id = player.Id;
        $scope.player.name = player.Name;
      }

【讨论】:

    【解决方案2】:

    使用editPlayer(player)

    假设editPlayer 填充表单,只需将player 对象传递给它。

    【讨论】:

      猜你喜欢
      • 2016-03-25
      • 2014-12-18
      • 1970-01-01
      • 1970-01-01
      • 2023-03-25
      • 2017-01-11
      • 1970-01-01
      • 2015-03-19
      • 1970-01-01
      相关资源
      最近更新 更多