Featured Partner Articles Cloud cost optimization best practices Read moreHow to choose a cloud provider Read moreDigitalOcean vs. AWS Lightsail: Which Cloud Platform is Right for You? Read more
おはようございます、@armorik83です。Angular 2の特徴的なAPIとして、前回は@Inputを紹介しましたが、今回は@Outputを取り上げます。 記事のサポート遅れについてお知らせとお詫び 先週の記事ではAngular 2 alpha.47を使用していたはずが、本稿執筆時点での最新バージョンはalpha.53となっており、何やら怒涛の勢いでalphaリリースが行われています。APIが安定する(と予想される)betaまでに詰め込めるだけのBreaking Changeを詰め込めという様子で、すでに先週公開した記事が最新alphaでは動かないという信じがたい状況になっております。変更の傾向を見ていると、機能そのものの追加や削減は見られないため、本記事が役に立たなくなることは無いと思っていますが、betaまで見守っているという状況です。このような情報鮮度のため読者諸氏にはご迷惑を
前回の記事で、Angular2のPipeを紹介しましたが、 すでにはじめから用意されているPipeをいくつか紹介しました。 しかし、Angular2では自分でPipeを定義できるんです。 煩雑になりがちな繰り返し処理をすっきりまとめることができるので、地味に重宝してます。 そこで、今回はカスタムパイプの作成方法を紹介します。 カスタムパイプを定義する 数字を入力すると、それに紐付いた文字列を出力するPipeを定義してみましょう。 「サーバーのAPIから取得する値は数字だけど、ブラウザでの表示は文字列」といったよくある場面を想定します。 今回は1〜9までの数字から、家族の続柄の文字列を出力してみましょう。 family-type.pipe.ts import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'family
Tutorial built with Angular 5.0.3 Other versions available: Angular: Angular 8 AngularJS: AngularJS In this tutorial I'll show you how you can implement animations between routes in Angular 2/5 and TypeScript. Project code is available on GitHub at https://github.com/cornflourblue/angular2-animation-tutorial-example. Difference Between Angular 2/5 Animations and AngularJS Animations Animations in
In this article, I am going to explain firstly how to configure an Application architecture, using Angular2 with Visual Studio code. In this, I am using systemjs.config.js to load modules compiled, using TypeScript compiler. There are lots of ways to load the modules in Angularjs2 e.g Webpack, Gulp, Grunt, etc. but I am going to develop an example, using systemjs.config.json. Install node.js on yo
Angular has become the de facto front-end MVC framework of the Web. We had been slowly adopting Angular 1 here at Lucidchart, but the vast majority of our crucial components were built in jQuery and vanilla JavaScript. We were one of the early pioneers of Angular 2. We found Angular 2 compelling because of the improved performance over Angular 1, and the structure, consistency, and productivity th
One of my favorite libraries is Vue. There’s a cool feature in this library that I want to steal for my Angular projects — Event modifiers. From the Vue documentation —It is a very common need to call event.preventDefault() or event.stopPropagation() inside event handlers. Although we can do this easily inside methods, it would be better if the methods can be purely about data logic rather than ha
本連載では、Webアプリケーションフレームワーク「Angular」の活用方法をサンプルとともに紹介しています。前回は、Angularが提供するアニメーション機能について解説しました。今回は、2017年3月にリリースされたAngularバージョン4の変更点や新機能と、今後のバージョンアップの見通しを紹介します。 はじめに Angularは、Googleとオープンソースコミュニティで開発されているJavaScriptフレームワークです。AngularJSと呼ばれていたバージョン1(AngularJS 1)から、バージョン2で大きく変更されて、以降はAngularと呼ばれています。バージョン2時点では「Angular 2」と呼ばれることもありましたが、現在はAngularが正式名称です。 Angularは2017年3月にバージョンアップされて、バージョン4になりました。Angularは今後、おお
【20160819更新】rc.5対応した記事を書きました。Angular 2入門:NgModelに触れてみる [rc.5対応] この記事で書かれている内容は古いため参考にされないようご注意ください。 おはようございます。今井です。 最近は、ng-kyotoというAngularユーザーコミュニティでオーガナイザーをさせていただいております。Angular 2というこれまでのAngular JSとは全く異なる(!?)フレームワークがそろそろβ版になるということで、初めて触れる次第です。 私が初めてAngular JSと触れた時に一番印象的だったのは双方向バインディングだったような気がします。その双方向バインディングがAngular 2でどうなったのかを見てみたいと思います。 注意:この記事では、Angular 1.xをAngular JS。Angular 2.xをAngular 2と呼称します
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近はSPA(シングルページアプリケーション)が流行っています。Ajaxを使わなかったとしても一つのページだけで表現されているのは閲覧者にとっても利便性の高いものになるでしょう。 そんなSPA用のCMSがCosmoになります。 Cosmoの使い方 デモページです。大きな写真が印象的です。 メニューです。 こちらは管理メニュー。 コンテンツの作成ができます。 テーマも用意されています。 多言語対応しています。 Cosmoを使えば一見すると管理しづらそうなSPAを上手にメンテナンスできます。ペラのHTMLファイルで作るのに比べてデータのアップデートが手軽にできますので、SPAサイトにお勧めです。 CosmoはPHP製のオープンソース・ソフトウェア(MIT License)です。 The
The situation I am trying to make what should be a very simple form in my Angular application, but no matter what, it never works. The Angular version Angular 2.0.0 RC5 The error Can't bind to 'formGroup' since it isn't a known property of 'form' The code The view <form [formGroup]="newTaskForm" (submit)="createNewTask()"> <div class="form-group"> <label for="name">Name</label> <input type="text"
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く