【Angular.io】 Template Syntax まとめ - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
[Angular2]複数httpリクエスト - Qiita
import { Injectable } from '@angular/core'; import { Http } from '@angular/http' import { Observable } from 'rxjs' @Injectable() export class HogeService { constructor(private http: Http) { } // 並列に実行してすべて完了したら結果をlogを出力するサンプル sample1() { let urls = [ "http://itunes.apple.com/jp/rss/newapplications/limit=10/json", "http://itunes.apple.com/jp/rss/newfreeapplications/limit=10/json", "http://itunes.ap
![[Angular2]複数httpリクエスト - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/2071c1dada09338992a1f2d3618fd5d6a19efebc/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMTIyMDA4JTJGcHJvZmlsZS1pbWFnZXMlMkYxNDczNzE1MDk1P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZiZz1GRkZGRkYmZm09cG5nMzImcz1mNzU2OTE2MWQyOTdjYWNjNzczOWY4MGQ5NzE5ZDVhMA%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D12295dc51a00a384ca67b5a34076a1fe%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCQW5ndWxhcjIlNUQlRTglQTQlODclRTYlOTUlQjBodHRwJUUzJTgzJUFBJUUzJTgyJUFGJUUzJTgyJUE4JUUzJTgyJUI5JUUzJTgzJTg4JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9NGI1NTQxMzFhZTFhMTA3NWJiNDZhYjE4MGY4MmFmMzA%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBhbzIteSZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1wYWQ9MCZzPWI0MWYyODU4ZTYwOGIwNDJjN2JkMGRjNjBjZTg4YjU1%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D0b5f00e16992f829d7802f3249836126)
Angular2でModal作る - Qiita
Angular2でモーダルを自作したメモ。 要件: Angular以外のライブラリには頼らない モーダルを開く時はServiceとして扱いたい モーダルの内側はComponentとして開発したい モーダルを閉じた場合、Promise(or Observable)をresolveしたい。 要するに、下記のようなコードを書きたいのだ。 import { Component , Input } from "@angular/core"; import { ModalContext } from "./modal"; @Component({ selector: "greeting", template: ` <div> <section> <input [(ngModel)]="message" placeholder="Message"> </section> <footer> <button
Angular4(Angular2~)のユニットテスト【Angularのユニットテストの基本とComponentの簡単なテスト編】 - Qiita
import {ComponentFixture, TestBed, async, ComponentFixtureAutoDetect,} from '@angular/core/testing'; import {By} from '@angular/platform-browser'; import {DebugElement} from '@angular/core'; import {AppComponent} from './app.component'; // describeでテストSuiteを作成 describe('AppComponentのテスト', () => { // テストの中のAppComponent let comp: AppComponent; // ComponentFixtureは、 componentのインスタンスそのものとcomponentのDOM
WebStromとAngular CLIでAngular2アプリケーションを作ってみよう - Qiita
こんにちわ、メトロノームかわかみ（@saruyama_monki）です。 Angularアドベントカレンダーの７日目は、WebStromとAngular CLIを使ってAngular2アプリケーション作ることを解説します。 WebStrom 2016.3について WebStormについての紹介は割愛させて頂きますが有料のIDEになります。 11月14日にバージョン2016.3のアップデードが入りまして、Angular CLIが使えるようになりました。 WebStormは、他の製品（PhpStorm、RubyMineなど）にも梱包されておりますので同じように使えます。 有料は。。。と思われる方は、まずは30日のFree Trial版を使ってみて下さい。プログラミングがもっともっと好きになると思います。 Angular2プロジェクトの作成 WebStromを立ち上げますと、プロジェクトの作成画
Angular4 + Express4 + MongoDB3 + TypeScript2 の最小構成プロジェクトをAngular CLIベースで構築する。(ビルド、テスト、Dockerデプロイまで) その１. ビルド編 - Qiita
Angular4 + Express4 + MongoDB3 + TypeScript2 の最小構成プロジェクトをAngular CLIベースで構築する。(ビルド、テスト、Dockerデプロイまで) その１. ビルド編JavaScriptMongoDBExpressTypeScriptAngular やりたいこと Angular CLI使って、MEANスタック(MongoDB + Express + Angular + NodeJS)のアプリを作りたい。どうせならサーバ側もTypeScriptで作りたい。 フロント側とサーバ側の両方をwebpack、gulpなどは使わずにnpm scriptsだけでビルド、テストできるようにしたい。 Dockerを使ってアプリを簡単に配布したい。 これらを達成するための最小構成プロジェクトの作り方を３回に分けて紹介します。 その１. ビルド編 ⇦ 今回はコ
Angular 入門 #1 - Qiita
この会の進め方 https://angular.io/docs を読み進めていきます Angular 自習のススメ angular.io/docs 公式サイトのドキュメントが充実 ここ読めばもうAngularマスターです 英語 https://github.com/ng-japan/hands-on ng-japan (Angular Japan User Group) が公開しているハンズオン 日本語 各自これをやりましょう（完）でいい気も angular.io/docs を読み進める デモを動かす 大体のページでブラウザ上ですぐ動かせるデモと、ダウンロードしてローカルで動かせるデモが用意されています The code referenced on this page is available as a live example / downloadable example. live e
Angular をやるのに欠かせない VSCode Extension - Qiita
2017/07/11(Tue) 時点の情報に基づいています Angular をやるのに Visual Studio Code (以降 VSCode) は相性ばっちりで、デフォルト設定でもほぼストレスなくプログラミングできるのが素晴らしいですが、以下の VSCode Extension をインストールすれば、さらに効率アップが図れます。 Angular Language Service Angular 本家が開発している Extension で template に対してプロパティ補完をしてくれる強力な Extension です。存在しないプロパティを指定すればエラーチェックがかかって教えてくれます。 Path Intellisense ファイルパスを補完してくれる Extension です。例えば Component の templateUrl や styleUrls に外部の HTML
Angular+Firebaseでチャットアプリを作る - Qiita
はじめに 今、最も注目されているJavaScriptフレームワークの１つであるAngular(9.xx)と、同様に注目度の高いBaaS（Backend as a service）であるFirebaseを使って、チャット用WEBアプリをハンズオン形式で書いていきます。 「Angular+Firebase」のリアルタイム更新に興味がある方はご一読ください。 （追記：2017/6）本記事は元々「Angular2+Rails5でチャットアプリを作る」と題していましたが、ここ半年ほどひたすら「Angular+Firebase」を触ってきたので、「Angular+Firebaseでチャットアプリを作る」として、現時点（2017年6月）での最新の内容に書き換えています。 （追記：2018/1）現時点（2018年1月）での最新の内容に書き換えています。 （追記：2018/9）現時点（2018年9月）での最
ng-japan 2017 セッション資料の一覧 - Qiita
はじめに 2017年6月17日(土)にng-japan 2017が開催されました。 その中でセッションに使用された資料が様々な場所で公開されていたので僭越ながらまとめさせていただきました。 公式 http://ngjapan.org ライブ配信(アーカイブ) ng-japan 2017ではライブ配信が行われていました。各セッションは以下のURLで視聴できます。 トラックA - https://www.youtube.com/watch?v=LbnLSD2pL18 トラックB - https://www.youtube.com/watch?v=P1X40cddHGU ご視聴ありがとうございました。ng-japan 2017のライブ配信を終了しました。 同じURLでアーカイブを見ることができますので、ブログ執筆や復習にご利用くださいhttps://t.co/7TraPhYohOhttps://
AtomからVisualStudioCodeに乗り換えた感想と設定メモ - Qiita
背景 今まではAtomを使っていましたが、重いため（メモリが食いすぎで3時間くらい使ってると7GBくらいいってる時がある。。。）乗り換えを検討していました。 いずれはVimmerになりたいなーと思いつつも、キャッチアップに掛ける時間があまり取れなかったため、なかなか乗り換えられずにいました。 そんな中、「VisualStudioCodeがいいよー」と知人から聞いたため、試しにやってみたら思いの外良かったので、乗り換えてみました。 その感想と、入れた拡張機能＋設定をメモします。 (今更ですが。。。) 特徴 公式の特徴 Mac OS X、Linux、および Windows、あらゆる OS、言語で動く Mac OS X、Linux、および Windows 、あらゆるプラットフォームで使用可能です。さらに、30 種類以上のプログラミング言語をサポートします。 Microsoft製なのにMac,Li
Angular Universalを試して数か月経ったので学びを書いていく - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? (この内容は社内LTで使ったものを文章化して引き伸ばしたものです。) (ゆっくり書いていたらAngular 4 RCが出てしまいました。。。) Angular Universalを使って、隙間時間にちまちまと社内向けのサービスを開発しました。 その間に試していて、詰まったり引っかかったりしたことを連々と書いていきます。 はじめに そもそもAngular Universalとは何かに関してはQuramyさんのこちらのAngular2のServer Side Renderingに触れてみるにお任せしたいと思います。 タイトルの通りAngul
Angular-CLIチートシート - Qiita
@armorik83です。今回はangular-cliについてまとめます。 angular-cli https://cli.angular.io/ Prototype of a CLI for Angular 2 applications based on the ember-cli project. angular-cliはAngularの2.x以上（本稿ではAngularと記述する）を用いたアプリケーションの開発を補助するCLIツールである。 インストール インストールは至って簡単だ。 node_modulesのグローバル空間にインストールするため抵抗がある人もいるかもしれないが、その場合適宜工夫してもらいたい。基本的にコマンドラインツールとして使うので、筆者はあまり問題ないと考えているが、バージョン違いによる挙動の差異があり得るため、チームで運用する際はメンバー間でバージョンについて
Dockerを使ってMacでもWindowsでもコマンド一発で動作するAngular開発環境を作る話 - Qiita
こんにちは、@yusuke_yasuoです。 Angular Advent Calendar 2016の9日目は、Dockerを使ってMacでもWindowsでもコマンド一発で動作するAngular開発環境を作る方法について書きたいと思います。 また今回は範囲外ですが、CI・CD周りも整備していきたいため、Angular CLI (https://github.com/angular/angular-cli) を使って開発してみました。 Docker使う理由 今回のDocker利用には主に2点ほど理由がありました。 社内にMac派とWindows派がいるため、環境が違うことによって起こる問題の吸収 今後メンバーが増えていく予定があるため、環境構築時間の短縮 今回のゴール Angular公式サイトのTUTORIAL (https://angular.io/docs/ts/latest/tut
Facebook製のJavaScriptテストツール「Jest」の逆引き使用例 - Qiita
はじめに みなさん、日頃JavaScriptのテストはどのように行っていますか？ 昨今ではAngularJSやReactJSを始め、JavaScriptのフレームワークやライブラリを使用してのフロントエンドの開発が当たり前のようになってきております。 ではそのフロントエンド、JavaScriptのテストはどんなツールを使っていますか？ mochaやpower-assert、chai、Karma、Jasmine等を組み合わせて使用してテストしているでしょうか。 前置きが少し長くなりましたが、Facebookが開発したオールインワンな「Jest」というツールのReactでのHowto的な使い方から実際のテストでの使用例を交えて紹介したいと思います。 ちなみにこのJest、最近リリースされて話題になったパッケージ管理のYarnでも使われています。 対象バージョン Jest:22.0.4 Reac
【2016年夏】個人的に注目なフロントエンドで使えるJavaScriptフレームワークまとめ - Qiita
 # はじめに Webサービスを開発するにあたり、JavaScriptのフレームワークは今や欠かせないものになりました。 多種多用なフレームワークがある中で、今回は主にwebサービスのフロントエンドで用いられるJavaScriptフレームワークをまとめました。 それぞれのJavaScriptフレームワークの詳しい使い方については、詳細に説明されているサイトが沢山あるので本記事では省略致します。 こんなフレームワークもあるんだなーと軽い感じで眺めていただけると幸いです！
Angular JSの良質チュートリアルまとめ - Qiita
随時更新中 日本語によるAngularのTips別チュートリアル AngularJS's tutorial ・とても丁寧に作りこまれていて、わかりやすい 公式チュートリアル AngularJS ・基本困ったらここ Yeomanのチュートリアル Step 10 ・かなり質が高い。 ・自分がチュートリ作る際にも参考になる。 angular-local-storage GitHub Demo ・上記のチュートリで使われるモジュール Further Reading THE PAST, PRESENT & FUTURE OF LOCAL STORAGE FOR WEB APPLICATIONS ・これは英語だけどかなりおすすめ ・Local Storageの背景とかも理解できた MongoDBも接続したい YEOMANを使ってMEAN（MongoDB + Express.js + Angular.j
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Django REST Framework + AngularでTodoアプリを作る - Qiita
Angular2のUIライブラリまとめ - Qiita
Angular 4.3で追加されたHttpClientModuleについてのメモ - Qiita
