ng-submitを利用してformのvalidationを使う
ng-clickではなくformにng-submitを設定してフォームを送信 ng-clickを利用したデータの送信 buttonタグなどにng-clickを追加して、他のフォーム部品(textareaなど)に設定したn […]
AngularJS
AngularJSでbuttonのdisabledをng-modelで連動させる
フォームのtextareaとbuttonをバインドしボタンを無効化する ng-disabledディレクティブでbool値に応じたbuttonの制御が可能 フォームを送信した後にボタンを無効化する。正確にはtextarea […]
angular.js ng-repeatの組み込み変数
ng-repeatのビルトイン変数を利用してtableの背景色を一行おきに設定 AngularJSのng-repeatディレクティブで利用できる変数 ng-repeatの組み込み(ビルトイン)変数は利用頻度が高いプロパテ […]
AngularJS Directiveを使ってclass属性を追加
ベーシックなカスタムDirectiveの作り方 じゃんけんの結果に応じてclass属性を設定する じゃんけんプログラムを例にAngularJSのDirectiveを利用してみる。
AngularJS使い方ガイド Ajax編
Modelデータ構築用のAjaxリクエストをrunメソッドで実行 Ajaxで取得するjsonファイルを作成 AngularJSの入門者向けに書いてきた掲示板アプリ作成記事の最後はAjax編になる。
AngularJS使い方ガイド Filter編
AngularJSに組み込みのFilterとは別にユーザーが独自にカスタムFilterを定義できる 掲示板の作成からはじめるAngularJSアプリ入門の手引き
AngularJS使い方ガイド Behavior編
Two-Way Data Bindingと合わせてBehaviorを設定し見た目を調整する Behaviorは$scopeに定義しディレクティブから利用 Two-Way Data Binding編では、ユーザーアクション […]
AngularJS使い方ガイド Two-Way Data Binding編
回答ツリーを表示し回答に対するレスを受け付け可能にし、レスの数と総回答数をバインドする Two-Way Data Binding AngularJSの主なトピックの一つになっている双方向データバインディングについて書く。
AngularJS使い方ガイド View編
View(html)で掲示板データの表示とディレクティブを使った繰り返し処理 HTML側でControllerで生成した$scopeのデータを利用 Model編で掲示板データを定義し、
AngularJS使い方ガイド Controller編
Controller編では掲示板データの一覧取得と新規投稿機能を実装する 回答一覧の取得 AngularJSを利用した掲示板アプリのController編では、
AngularJS使い方ガイド Model編
Model編では掲示板アプリのデータ構造を定義しmoduleを設定する json形式のデータ構造をjavascriptで定義 入門編に続いてModel編になる。
AngularJS使い方ガイド 入門編
掲示板の作成からはじめるAngularJSアプリ入門の手引き 入門編ではベースとなるhtmlを作成 AngularJS入門ガイドの入門編としてAngularJSの機能を載せるhtmlを作成する。
開発用のREST APIをDeploydで素早く構築
AngularJSの開発用やテスト環境のバックエンドAPIを高速に準備する AngularJSの入門記事
AngularJSでオブジェクトや配列を列挙する方法
集合データをjs同様AngularJSでも数え上げることができる オブジェクトデータ AngularJSでは、主に
ng-classで条件に応じてclass属性を設定
bool値や条件式の結果に応じてclass属性を追加するAngularJSのng-class true/falseに応じてclassを設定 AngularJSのng-classでは、HTMLのclass属性を動的に設定す […]
バックエンドと連携した投票カウンターの作り方
AngularJSで投票システム(サムアップカウンタ)を開発する 画面遷移の無い投票インタフェースからREST API経由でカウントアップ AngularJSのサンプルアプリとして投票カウンターを作る。
繰り返しの中でng-modelを動的に生成
ng-repeat内でng-clickなどのディレクティブをダイナミックに利用する AngularJSで操作とデータが連動したリストを作る AngularJSのディレクティブを利用してデータがバインドされた表やリストを作 […]
AngularJSでWYSIWYGエディタを利用
AngularJSにSummernoteのWYSIWYGエディタを統合する angular-summernoteでSummernoteをdirective化してAngularJSで利用可能 AngularJSにWYSIW […]
$routeProviderのresolveにServiceを指定しControllerにデータを注入する
resolveを利用してControllerに処理が移動する前にバックエンドからデータを取得しておく その結果Controllerをよりシンプルに書ける AngularJSの$routeProviderを中心にコードを構 […]
controller内のModel処理をserviceとして分離する
AngularJSでバックエンド連携部分をServiceにまとめる controllerからAjaxリクエスト部分を除外する AngularJSにはServiceという概念がある。
AngularJSのURLリロード問題をmod_rewriteで対応
$locationProvider.html5Mode(true)の場合 AngularJSのURLからハッシュフラグメントを消す AngularJSでハッシュ(#)記号なしのURLにしたい。
AngularJSでサーバサイドのバリデーションエラーをハンドリング
CakePHPのバリデーションエラーをフロント側で表示する バックエンド側の準備 Modelの作成 AngularJSからCakePHPのRestful APIにAjaxリクエストを行うCRUDアプリケーションのサンプル […]
AngularJSでAjaxリクエスト中にLoading画像を表示
カスタムDirectiveを利用して画面遷移中にoverlay表示 AngularOverlay Directive CakePHPをバックエンドとしたRestfulなAngularJSのサンプルアプリを開発している。
AngularJSの$routeProviderでURLをマッピング
AngularJSの$routeProviderでControllerとURLをマッピングする ControllerだけでなくtemplateUrlもマップする AngularJSの$routeProviderでURLと […]
AngularJSからRestfulなリクエストを送信
CakePHPのrestfulインタフェースにAngularJSからリクエストしてデータを取得 CakePHPで効率的にrestful APIを開発 AngularJSでCRUD操作を行うアプリケーションを開発するにはど […]
AngularJS入門
AngularJSの使い方をangular-seedの構築から始める AngularJSの入門記事