skillup

技術ブログ

JavaScript

AngularJSについて

投稿日:2016年12月27日 更新日:

前回のbowerの記事でちょこっと書きましたが、最近はAngularJSというJavaScriptのフレームワークを触っています。

数年前から流行りだしているようで、少しずつ使っている方も増えているのではないでしょうか。

AngularJSとは?

機能的なことなどはいろんな場所で書かれています。網羅性でいうと下記リンクが一番詳しいでしょう。

AngularJSの特徴についてまとめました

自分が採用した一番の理由ですが帳票の明細行の追加や削除を楽にしたかったからです。

例えば受注情報を作るときにはよほど特別なものでなければ伝票(注文日、注文者などの情報)と明細(個別の商品の情報など)に分かれます。

この明細行なんですが通常のjQueryだけだと作るのがめっちゃ大変です。自力で作った方は大変さがわかっていただけると思います。AngularJSのサンプルをみたところこれが非常に簡単にできることを知り早速取り入れてみることに・・・・

学習コストもそこそこあるため、慣れるまでは結構時間がかかりましたが、慣れていざ帳票部分を作ってみるとすごく楽です。特に計算なんかをするのがめちゃくちゃ楽で、今までjQueryでがりがり書いていた労力は何だったんだろうという気がします。

といってもやろうと思ってから形になるまではなかなか進まず数か月かかりましたが・・・・

参考

http://8th713.github.io/LearnAngularJS/#/

念願の帳票の明細アプリはこのリンク先のものを使用させていただきました。サイト構成といい、アプリといい最高です。めっちゃ感謝!

AngularJS でAPIをコールし結果を取得するサンプル①

プログラム側との連携は上記のように書けばOKです。

次回以降、自分の整理の意味も込めて詳しくAngularJSについて説明していこうと思います。

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

timepickerについて

日付を入力するときに直接、文字入力するのがメンドイことからカレンダーが表示されるプラグインを使っている人は多いでしょう。 私も日頃Datepickerというライブラリを使っています。が、このプラグイン …

no image

JavaScriptでの時計作成

今回はWebアプリで1秒ごとに更新されるデジタル時計の作成方法について。 基本的には 現在時刻を秒まで含めて表示 その関数を一秒ごとに更新 でOKです。 ネットにどんぴしゃりのサンプルが落ちていたので …

no image

JavaScriptのexport

JavaScriptのexportについて。 es6の大きなメリットとして、ライブラリをモジュール化して、外部から読み込むことができますが、読み込み方に少し癖があります。 気をつけるポイントとしては、 …

no image

yarnコマンド

JSやフロント側のライブラリを使うときはnpmを使ってたんですが、2〜3年前ぐらいからyarnというコマンドも使われているので、ちょっと調査を。 Contents1 yarnとは?2 よく使いそうなコ …

no image

AngularJSでのDB接続

AngularJSでデータベースへのアクセスをしたいときの処理を記述します。 注意点としては、なんといっても非同期なことです。同期させることも無理ではないようですが、基本非同期ですので、この点を理解し …

アーカイブ