AngularJS 1.0.8から1.2.0に移行してみた、はまったこと

  • 投稿日:
  • by

AngularJS 1.2.0がリリースされたので、 今までangular-1.0.8を使っていたプロジェクトをアップデートしてみました。

そのときに困ったこと、修正したことをメモしておきます。

まず初めに、読み込むスクリプトを変えたのですが、エラーになりました。

Error: [$injector:modulerr] http://errors.angularjs.org/undefined/$injector/modulerr?...

のようなエラーです。何かが悪いのは分かりますが、エラーの内容が分かりません。ここが、一番はまったところです。実は、minifyしたスクリプトだとこのようなエラーになるようです。angular.min.jsの代わりにangular.jsを読み込むようにしたら、エラーの原因が分かるようになりました。

一つ目のエラーはngRouteが別ファイルに分かれていることでした。これは、angular-route.jsを読み込むようにして、

angular.module('myApp', ['ngRoute']);

のようにすることで解決しました。

二つ目のエラーはng-bind-html-unsafeが使えないことでした。ng-bind-htmlに統合されて賢くなっています。angular-sanitize.jsを読み込んで同様に設定するだけで、サニタイズされるようになりました。ついでに、linkyというフィルターも入ったのでこれまで自作していたフィルターが不要になりました。詳しくは、

http://code.angularjs.org/1.2.0/docs/api/ngSanitize

のドキュメントを読んでみてください。linkyはアンカーのtarget属性も指定可能で、例えば、

<p ng-bind-html="x | linky:'_blank'" />

のように使います。

今回のケースはこの二つだけの修正で移行が完了しました。 angular-1.2.0ではその他変更点も多数あるようなので、これだけでは済まないケースもあるとは思いますが、一例として参考になればと。

今後、1.2.0の新しい機能にも挑戦していきたいと思います。


11/13追記。

もう一点修正が必要なものがありました。

Error: [$parse:isecprv] Referencing private fields in Angular expressions is disallowed!

というエラーがでていました。 オブジェクトの中のフィールドにアクセスできなくなったようですね。private fieldってなんだろう。まさか、単にアンダーバーのprefixが付いているというだけかしら。いずれにしても、オブジェクトごと関数に渡すようにして解決しました。

http://docs.angularjs.org/error/$parse:isecprv

に書いてありました。アンダーバーで始まるか終わるかするとプライベートとみなされるみたいです。