hello foo bar Saba note | AngularJSの最初の一歩

AngularJSの最初の一歩

2016.7.27 (水)

ライブラリーを呼び出す

AngularJSはjQueryと同じようにライブラリー的なものを使います。まずは面倒なのでGoogleのCDNからライブラリーをひっぱってきて使うとよいと想います。

<head>
....
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
....
</head>

これで最初の準備は整いました。
次にAngularJSのアプリを使うことを宣言します。これがないとダメです。

<html lang="ja" ng-app>

ng-appをhtmlタグの中に書いてあげるだけです。これでAngularJSが使える準備がすべて整いました。

Modelを使ってみる

AngularJSはMVCといわれるフレームワークの一種なので、Modelという概念があります。今回はあんまり深いことを考えずにModelをとりあえず使ってみます。

<input type="text" ng-model="test">
<p>{{test}}</p>

これでフィールドに入力したものがリアルタイムでpタグに書きだされます。sample
なるほど。かなりいい感じです。