angularJS handson注意事項 - MSakamaki/angularJS-handson-21cafe GitHub Wiki

##注意事項のページ handsonの際の注意事項とか


AngularJS1.2.0環境でAngularLocalStrageとng-repeatを共存させるとエラーが発生する件

この問題はng-repeatが実行された際に、AngularJS側でのJSObjectにrepeatした行を特定する$$hashKeyと言う物が自動で生成され、LocalStorageとの同期がとrずエラーとなっていました。 こちらの問題はAngularJS1.2.0で発生し、以下の機能を使うことで回避できます。

<li class="notes-entry" ng-repeat="todo in items" >

上記を以下のように書き換えます。

<li class="notes-entry" ng-repeat="todo in items track by todo.title" >

こうすることでtrack by [hoge]で指定した項目が$$hashKeyの代わりに適用され、$$hashKeyが自動生成されなくなり、エラーとならなくなります。
実際、issues/1-4-1にて、track by todo.titleを取り除いて以下の手順を実行するとコンソールにエラーが吐き出されます。

  1. データの登録を2件以上行う。
  2. その状態で画面更新(F5キー)を押す
  3. コンソールにエラーが吐かれ、以降リピーターが動作しない。

情報を提供してくれた吉田 徹生さんに感謝!


ブラウザコンソールメッセージ

Choromeのコンソールメッセージに以下のような警告がでるようですが、JQueryのバグで発生しているようです。

event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

参考URL

情報を提供して頂いた吉田 徹生さんに感謝!


grunt 関連

grunt-contrib-imagemin

Grunt-imageminはは 32bit 版では動かないので32bitOSの場合、以下のように書き換える必要があります。

package.jsonを以下のように書き換えます。
  • [変更前]
    "grunt-contrib-imagemin": "~0.2.0",
  • [変更後]
    "grunt-contrib-imagemin": "~0.1.1",
⚠️ **GitHub.com Fallback** ⚠️