読者です 読者をやめる 読者になる 読者になる

コンパイラかく語りき

文系新卒プログラマーのメモ

AngularJS入門① ~HelloWorld~

どうも!chuckです。

今日からゆるーくAngularJSを勉強していきます。前回ドットインストールで勉強したっきり、全く手をつけていなかったので、さらっと復習します。復習が終わったらカンタンなシングルWebアプリケーションでも作ろうかなヽ(=´▽`=)ノ

 

 前回の↓↓

chuckwebtips.hatenablog.com

 

 

HelloWorld

なにはともあれハロワです。

f:id:chuck0523:20150722222235p:plain

2行目でAngularを使うことを宣言。

5行目でAngularJSをインクルード。

8行目でテキスト入力した文字を、9行目のpタグの中に表示させています。

 

実行結果がこちら。

f:id:chuck0523:20150722222347p:plain

うーん、やっぱりすごい。

 

まあでもjQueryでもできるっちゃあできる。

f:id:chuck0523:20150722223242p:plain

keyupイベントを使って、入力毎にイベント発火。入力した文字列をHello, の後に追加しています。

 

f:id:chuck0523:20150722223400p:plain

 

おわり

というわけで、手短ですが今回はここまで。次回はコントローラを使っていきます。たぶん、次回からはAngularスゴい!となるはずですw

 

書いたコード

gistb7aaf54b215a4b4b3516

 

gist8c2e7b3b34ad7a9036a1

 

参考にしたサイト様

keyup(fn) - jQuery 日本語リファレンス