AngularJSを触ってみた

AngularJSとは
AngularJSとは
・MVCパターンを採用したJavaScriptのフレームワーク
・フルスタック
主な用途
・データ変更が多く、即座に画面反映したいアプリ
・管理画面
・ SPA(シングルページアプリケーション)

AngularJSの機能
テンプレート
– ディレクティブ
– AngularJS 式
– データバインディング
MVC
– Controller
– テンプレートとの関連付け
– サービス
→ビジネスロジックの分離
– 依存性注入
→ DI (Dependency Injection )
– ルーティング

サンプルコードでjQueryとAngularJSを比較
コード例
テキストボックスに入力された文字列をHTML要素内に反
映する

//jQueryによる実装
<input type="text" name="hoge" />
<div id="target"></div>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript">
$("input[name=hoge]").change(function(){
$("#target").html($(this).val());
});
</script>

今後の動向
バージョンは現在1.x系が使われていますが、2.xほぼ別物
になるようです
2.x系の特徴
・ECMAScript6（ES6）の採用
・ng-xxx記法を廃止して、記号（[]、()、#）による式やイベント
記述

今後の動向
バージョンは現在1.x系が使われていますが、2.xほぼ別物
になるようです
2.x系の特徴
・ECMAScript6（ES6）の採用
・ng-xxx記法を廃止して、記号（[]、()、#）による式やイベント
記述
2.x系がリリースされたら再チャレンジしたいです!!

AngularJSを触ってみた

More Related Content

What's hot (20)

Viewers also liked (12)

Similar to AngularJSを触ってみた (20)

AngularJSを触ってみた