フロントエンド - Angular ショッピング カートの合計価格と削除機能が無効です

Question

angularjs を学習する過程で、簡単なショッピング カートの練習を行ったところ、次の 2 つの問題に遭遇しました。
1. 商品の合計価格 ($scope.TotalPrice) が機能しません。モデルは上でバインドされているため表示されません
2. 単一の製品を削除 () すると、他の製品もそれに応じて削除されます
デモのリンクは次のとおりです
http://jsbin.com/qometulete/edit?html,js,output
HTML コードは次のとおりです

リーリー

JSコードは以下の通りです

リーリー

Answer 1

まず実行結果を見てみましょう: http://jsbin.com/vajeru/3/edit?html,js,output

あなたの質問は次のとおりです:

• 削除方法が間違っています。1 つの key ==index を削除すると、$scope.datas 内の後続の要素の配列インデックスが変更されます (1 ずつ減少します)。要素のインデックスは削除する必要があるインデックスと同じであるため、index 以降のすべてのメンバーが削除され、splice を使用して削除メソッドが書き換えられました。配列のメソッドkey == index 删除一个之后，$scope.datas 中其后的元素的数组索引会变化（减1），元素的索引又和需要删除的索引相同了，从而会删除 index 之后的所有的成员，删除方法已经重写，使用数组的 splice 方法

• getNum() getTotal() 两个方法，需要在控制器初始化的时候，执行一次，由于没有初始运行，而且没有在初始化的时候定义 TotalNum 和 TotalPrice ，所以两个值是不会显示的。而且你是使用变量声明的方法定义的这两个函数，所以在定义它们之前调用会是 undefined

• getTotal() 中，你把 price 拼写错为 pirce，从而 $scope.TotalPrice 会是 NaN，你用 number: 2 过滤器，当然就显示不出来

另外给你如下的建议：

• 值可以确定类型的时候，比较不要使用 ==，尽量使用 ===

• 变量一定要在函数的头部一次性初始化，比如，将数字初始化为 0

• 不要在循环之中调用可以在循环之外调用的方法，比如你在 reduceNum() addNum() 里不停的调用 getTotal()

• getNum() getTotal() 初期操作がなく、初期化中に定義されないため、2 つのメソッドはコントローラーの初期化時に 1 回実行する必要があります。 code>TotalNum と TotalPrice なので、2 つの値は表示されません。そして、これら 2 つの関数は変数宣言メソッドを使用して定義されているため、定義する前にこれらを呼び出すと 未定義 になります

getTotal() で、price のスペルを pirce と間違えたため、$scope.TotalPrice は になります。 >NaN、number:2フィルターを使用すると、当然表示されません🎜🎜 🎜 🎜さらに、次の提案をします: 🎜 🎜 🎜🎜値によって型を決定できる場合は、== を使用せず、=== を使用することをお勧めします🎜🎜 🎜🎜変数は関数の先頭で一度初期化する必要があります。たとえば、数値を0に初期化します🎜🎜 🎜🎜たとえば、reduceNum() addNum()< で getTotal(() を呼び出し続ける場合、ループ外で呼び出すことができるメソッドをループ内で呼び出さないでください。 /code> )🎜🎜 🎜🎜トラバース中、ループから飛び出せるときは、できるだけ早くループから飛び出すようにしてください🎜🎜 🎜

Answer 2

両方の合計が対応する関数で宣言されている場合、誰もこれら 2 つの関数を呼び出さない場合、これら 2 つの合計はどのようにして存在するのでしょうか?あなたの書き方はとても角がありません。

Answer 3

1. プロダクトを削除するメソッドで、_remove メソッドが間違っています。
2. getNum getTotal メソッドで、len が定義されていません。問題もあります