AngularJS

ngRepeat を特定のフィールドについてフィルタリングする

app.controller('Ctrl', function($scope) { $scope.widgets = [ { name: 'foo', description: 'basic model' }, { name: 'bar', description: 'upper model of foo' } ]; }); name と description を持つ Widget というモデルがあって、これを ngRepeat で…

AngularJS の Service の考え方

AngularJS の Conceptual Overview にわかりやすく書いてあった。ビューに依存しない再利用可能なビジネスロジック。コントローラにすべてのロジックを記述してアプリケーションを作ることも可能だけれど、それだとコントローラがどんどん肥大化してしまう。…

JSON と JSONP

AngularJS の勉強をしていたら $http.jsonp() が出てきて「!?」となったので JSONP について調べてみた。こちらの記事がわかりやすかった。 JSONPで悩むある程度の人々へ今まで違いを意識したことがなかったけれど、異なるドメインの JSON データを取得す…

AngularJS の binding がこうだったらいいのになという動きをしてくれた話

ngRepeat を使った以下のようなテンプレートがあるとします。 tweet の内容、Like かどうか、Like ボタンをテーブルで表示します。 <tr ng-repeat="tweet in tweets"> <td>{{tweet.content}}</td> <td>{{tweet.is_liked}}</td> <td><button ng-click="like(tweet)">Like</td> </tr> コントローラでは API を使って tweet を取得する部分と、ngClick のイベント…

audio 要素で音声再生しようとしたらエラー

<audio ng-src="{{some_object.url}}"></audio> audio 要素に ng-src ディレクティブでソース指定して、他サーバにある音声を再生しようとしたら Blocked loading resource from url not allowed by $sceDelegate policy.というエラーが発生した。ググったら AngularJS 公式がヒットした。 http://docs.an…

Step-7

マルチビューを持つアプリケーションの作り方。マルチビューとルーティングとレイアウトテンプレートこれまでは1つのビューしかなかったので全てのテンプレートを index.html に記述していた。 マルチビューにするにはまず index.html をレイアウトテンプレ…

AngularJS Tutorial をやってみた(Step-0 -> Step-2)

http://docs.angularjs.org/tutorialStep-0 <html ng-app> ngApp ディレクティブを表す。 上の例だと html 要素がアプリケーションのルート要素と見なされる。 html ページ全体をアプリケーションとすることもできるし、ページの一部をアプリケーションとすることもできる</html>…

AngularJS 入門

なんで AngularJS?http://angularjs.org/ より。 HTML は静的なドキュメントを記述するのには向いているが、動的なウェブアプリケーションを作るのには向いていない。 AngularJS はアプリケーションを作るのに必要な語彙を HTML に追加する。 →「HTML の語…