0

私はAngularJSを学ぼうとしています。私の最初のプロジェクトでは、小さなスコア管理アプリケーションを作成したいと考えています。JSON ファイルからデータを取得しているので、スコアに応じて画面上でデータを更新したいと考えています。

Angular を使用して特定の目標フィールドを更新する方法がわかりません。私の現在のアプリケーションは、新しい行をスコアシートにプッシュします。

'use strict';

/* Controllers */

function ScoreKeeper($scope, $http) {

  $http.get('json/hometeam.json').success(function(data) {
    $scope.hometeam = data;
  });

  $scope.addGoal = function() {
    $scope.hometeam.push({goals: +1});
  };
}

これは私が現在使用しているテーブルです：

    <table class="table table-hover">
        <thead>
            <th>Player ID</th>
            <th>No.</th>
            <th>Name</th>
            <th>GP</th>
            <th>G</th>
            <th>A</th>
            <th>PIM</th>
            <th>Goal</th>
            <th>Assist</th>
            <th>Assist</th>
        </thead>
        <tbody>
            <tr ng-repeat="player in hometeam" >
                <td>{{player.playerid}}</td>
                <td>{{player.no}}</td>
                <td>{{player.name}}</td>
                <td>{{player.gp}}</td>
                <td>{{player.goals}}</td>
                <td>{{player.assists}}</td>
                <td>{{player.pim}}</td>
                <td><button class="btn btn-small" name="add-goal" type="button" ng-click="addGoal()"><i class="icon-plus"></i></button></td>                
            </tr>
        </tbody>
    </table>

特定のプレーヤーの addGoal をクリックして、目標の合計を更新できるようにしたいと考えています。現在、現在の関数は、目標が 1 で、他のすべてのフィールドが空である新しい行を作成しています。

これについてはかなり迷っています。データは更新時に正しくレンダリングされていますが、更新機能はそうではありません。.push() が正しい方法ではないことはわかっていますが、Angular が使用する正しい方法を判断するための適切なリソースを見つけることができないようです。どんな助けでも大歓迎です。ありがとうございました。

4

2 に答える 2

1

に要素を追加したいと思いますよねplayer.goals？

次に、次のことができます。

<button ng-click="addGoal($index)">

jsで：

$scope.addGoal = function(index) { $scope.hometeam[index].goals++; };
于 2013-02-05T03:17:58.593 に答える
1

プッシュを使用して新しい配列アイテムを作成する代わりに、関連するプレーヤー アイテムのゴール プロパティをインクリメントする必要があります。 ng-click="addGoal(player)".

$scope.addGoal = function (player) {
    player.goals += 1;
};

あるいは単に

ng-click="player.goals = player.goals + 1"

于 2013-02-05T03:14:50.530 に答える