タグ

angularに関するtyruのブックマーク (32)

  • AngularJSのCompileとLinkってなぁに? - Qiita

    はじめに AngularJSのDirectiveについては、カスタムディレクティブの作成方法含め、おおよそ理解していたつもりであったが、CompileとLinkについて、若干自信が無い部分があったので、勉強がてら少し厚めに書いてみた。 なお、公式の開発ガイドにも、Oreillyの書籍でも書かれているが、カスタムディレクティブを開発することがあっても、殆どのケースでは、Linkの処理のみを気にするだけでよいため、あんまりこのエントリは役には立ちません。 おさらい 「AngularJSのDirectiveを理解する」にも書いているが、ざっくり言うと、Angularのディレクティブがテンプレートから実際のViewを描画する際は、Compile → Linkの2フェーズに分かれている。 Compile:ディテクティブのテンプレート(html文字列ではなく、DOMオブジェクト)から、Link関数を生

    AngularJSのCompileとLinkってなぁに? - Qiita
    tyru
    tyru 2016/04/08
    ng-repeat の例
  • module.component - AngularJS v1.5 - Qiita

    AngularJS Advent Calendar 2015 6日目の投稿です。 先日 AngularJS v1.5.0-beta.2 がリリースされましたね。 そこで、v1.5.x で新しく追加された機能3つを、今日から3日連続で紹介してみます。 AngularJS v1.5 から module.component という機能が実装されました。 これまでは <my-element></my-element> など独自要素を作成する際は、module.directive を利用していました。しかしv1.5 からは module.component を利用することで、より少ないコードで実装することができるようになります。 とりあえず使ってみる 参考サイトを見ながら試しに使ってみます。以下のような構文になります。 angular.module('sampleApp', []) .control

    module.component - AngularJS v1.5 - Qiita
    tyru
    tyru 2016/04/07
    AngularJS v1.5.0-beta.2 での component() の実装と解説が書いてある
  • Angular2は「モダンJavaScriptの学習セット」!エキスパートによるディスカッションが熱かった(詳細な注釈付き!)

    Angular2は「モダンJavaScriptの学習セット」!エキスパートによるディスカッションが熱かった(詳細な注釈付き!) 白石 俊平(HTML5 Experts.jp編集長) こんにちは、編集長の白石です。 去る3月9日、AngularJSのエキスパートによる座談会におじゃまさせていただきました。この座談会はAngularJS Japan User Groupの佐川 夫美雄さんの呼びかけによるもので、お題はもちろん、現在β版として公開中のAngular2。「ハードル高い」「Angular1と違いすぎる」など、いろんな情報も飛び交う中で、Angular2の魅力と課題について存分に語っていただきました。 Angular2に関心のある方にはもちろんのこと、Angular1しか触ったことのない方、そもそもAngularJSは初めてという方にとっても貴重なご意見が満載!エキスパート同士の会話と

    Angular2は「モダンJavaScriptの学習セット」!エキスパートによるディスカッションが熱かった(詳細な注釈付き!)
  • Angular 2への移行を助けるライブラリ angular-http-harness の紹介 - Qiita

    どうも、らこです。物好きなみなさんはもうAngular 2への移行を始めていると思いますが、$httpの移行どうしてますか? Angular 1の$httpからAngular 2のHttpへの移行を助けるライブラリ angular-http-harness を作ったので、何が問題で、何を解決できて、どう嬉しいのかを紹介します。 用語の統一 サービス: ビューから切り離されたアプリケーションまたはライブラリのロジック。 $http: Angular 1のHTTP通信モジュール Http: Angular 2のHTTP通信モジュール $httpの移行に伴う問題 ほぼすべてのAngular 1のアプリケーションは$httpを使っているんじゃないかと思うので今更説明の必要はないと思いますが、改めて言うと$httpはAngular 1で(たいていはAjaxのために)HTTP通信を行うのに便利なサービ

    Angular 2への移行を助けるライブラリ angular-http-harness の紹介 - Qiita
  • Exploring Angular 1.5: Lifecycle Hooks by thoughtram

    Angular 1.5 has been finally released and it’s more powerful than ever before! Many new features have been added and tons of fixes landed in the latest bigger release. If you’re following our articles, you know that we love to give an overview of the latest and greatest in the Angular world. Last year we blogged about the 1.3 release in our article series Exploring Angular 1.3. With this article w

    tyru
    tyru 2016/03/30
    $onInit(), $onChanges(), $onDestroy() / Lifecycle Hooksばっか目奪われてたけど $postLink() ってこれめっちゃ便利やんけ
  • Angular 2で作った最初のアプリの事後分析 : 使ってわかったAngular 2の長所と短所 | POSTD

    最近、Angular 2を使ってWebアプリ作成の手伝いをする機会がありました。このフレームワークの複雑さに戸惑いもありましたが、Angular 2は間違いなくすばらしいものです。この事後分析では私がAngular 2のフレームワークを使った時に感じたいい面と悪い面の両方を掘り下げていくことにします。 Angular 2 Angularは携帯電話やデスクトップのWebアプリケーションを作成するための開発プラットホーム。 https://angular.io/ Angular 2+リアクティブプログラミング=❤ 私はすでに、Angular 1アプリケーション ではRxJSをかなり使っていました。特に、サービス間のメッセージ・バスを行うアプリを作成する時です。Angular 2はObservableを非常によくサポートしているので、アプリ全体にリアクティブプログラミングを取り入れることができ、

    Angular 2で作った最初のアプリの事後分析 : 使ってわかったAngular 2の長所と短所 | POSTD
  • 【AngularJS】CSSのfilterを組み合わせた画像の遅延読み込みで体感速度を向上させる - 人生dat落ち

    運用しているサービスの利用画面がこんなんだった。 そんなわけで、前から試そうと思っていた極小の画像にCSSのfilterを適用し、大きな画像が読み終えたら差し替える手法を適用した。 遅延読み込み用のぼやけた画像 - Weblog - Hail2u.net The “Blur Up” Technique for Loading Background Images | CSS-Tricks filterの使い方の説明はコードと結果画面が一緒にまとめられているこの記事が分かり易い。 filter | CSS-Tricks 実装画像の読み込みが終わったタイミングで画像の差し替えおよびfilter効果の切り替えを行います。 app.jade .item__image(from-img-src='data/thumbnails/{{item.thumbnailFileName}}', to-img-s

    【AngularJS】CSSのfilterを組み合わせた画像の遅延読み込みで体感速度を向上させる - 人生dat落ち
    tyru
    tyru 2016/02/14
    【エロ注意】読み込みが完了するまではサムネイル用の小さい画面をCSSのfilterで拡大して表示しておくと。プログレッシブJPEGみたいな感じか。
  • その使い方はもう古いかも?AngularJS老化チェック(ディレクティブ篇) - Qiita

    こんにちは、らこです。AngularJSのバージョン1.5.0がリリースされましたね! コードネームは ennoblement-facilitation、ざっくり訳すなら「高尚化促進」でしょうか。コンポーネント志向の「高尚」なアプリケーション設計への移行をサポートするバージョンだということでしょう。 1.5.0ではcomponentの追加をメインに、Angular2へのスムーズな移行を行うための足がかりとなるアップデートです。いい機会なので、 今の自分のAngularJSの使い方がどれくらい古いのか をチェックし、どのようにモダンにしていけばいいのかを知っておきましょう。 ちなみに、1.4までに関しては AngularJSモダンプラクティス - Qiita を参考にするとよいでしょう。 このモダンプラクティスに従ったコードになっていればcomponent()対応はあっという間のはずです。

    その使い方はもう古いかも?AngularJS老化チェック(ディレクティブ篇) - Qiita
  • Angular JS で複数のコントローラ間でモデル(状態や値)を共有する方法 3 種類 - Qiita

    はじめに Angular JS で複数のコントローラ間でモデル(状態や値)を共有する方法として、次の 3 種類を解説します。 モデルを共有するサービスを使用する (Shared Service)。 親コントローラのスコープを子コントローラで共有する (Parent Scope Sharing)。 イベントを利用する (Pub/Sub)。 Shared Service 複数のコントローラ間で共有するモデルをサービスとして作成し、そのサービスを複数のコントローラで参照します。 実装例を示します。 <!DOCTYPE HTML> <html ng-app="AngularJsStudy"> <head> <title>Shared State Service - AngularJS Study</title> <meta charset="utf-8" /> <meta http-equiv="

    Angular JS で複数のコントローラ間でモデル(状態や値)を共有する方法 3 種類 - Qiita
    tyru
    tyru 2015/12/19
    1.Shared Service 2.Parent Scope Sharing 3.Pub/Sub と3通りあって、公式的には1がオススメされてるらしい
  • AngularJS の $locationProvider.html5Mode について - Qiita

    AngularJS で構築するアプリケーションで $locationProvider.html5Mode をどう設定するか小一時間悩んだ結果をまとめてみました。 導入 AngularJS では $routeProvider を使用してクライアントサイドでのルーティングが可能です。 angular.module('app').config(['$routeProvider', function($routeProvider) { $routeProvider .when('/aaa/', {controller: 'AaaController', templateUrl: 'aaa.html'}) .when('/bbb/', {controller: 'BbbController', templateUrl: 'bbb.html'}); }]);

    AngularJS の $locationProvider.html5Mode について - Qiita
    tyru
    tyru 2015/12/19
  • AngularJSは今すぐ生まれ変わるか死ね - Write and Run

    mizchi 氏のエントリを踏まえて。 Angularが嫌い - mizchi's blog 何をやるにもググって解決しなければならないぐらいには一貫性がない マジでこれ。設定が多すぎる。特に directive 定義。どうやら Web Components の流儀に沿うようになっていて、将来的には Web Components に乗っける、ということらしいが、そもそもの Web Components の仕様が汚いし、救いようがない。 参考: AngularJS: Developer Guide: Directive 制御構造と要素を分離してねぇせいで replace とかいうオプションが生えてるし、tranclude との組み合わせでより複雑なことになるし、isolated scope な directive は併用できないとか、ng-repeat で作られた scope の下に他の d

    AngularJSは今すぐ生まれ変わるか死ね - Write and Run
  • Angularが嫌い - mizchi's blog

    僕は当にAngularが嫌いで、もはや許せないレベルに達していて、今ではもう当に使いたくない。 イカ理由。 APIがほんっっっっっとうに糞 趣味の問題といえばそうでもあるが僕は糞だと思う 実装が黒魔術 良識あるJSエンジニアなら Function.prototype.toString() しない 実際に一部のクロージャが破壊されてて挙動が直感に反する DirtyCheckの実装、表面的にもDirtyな挙動として現れるのでデータバインドとして何も嬉しくない Googleだから許される、みたいなコミュニティの驕りが当に嫌 Angularの都合だけでChromeでObject.observeを前倒しするのやめろ Angularの内部モジュール同士が密結合 DI, module, factory, それぞれ大きなテーマなのに密結合 使いはじめるとAngularをやめることが困難 パフォーマン

    Angularが嫌い - mizchi's blog
    tyru
    tyru 2014/10/07
    やっぱdirty checkが嫌でEmberJSの方に行ってよかった… 未だに勉強中だけど