Angular の入力チェックとエラーメッセージについて

やりたいこと

Angular 5 で、以下の要件を満たすページを作りたい。

要件

  • 入力チェックのタイミングは Submit 時(リアルタイムではない)
  • エラーメッセージ領域は1行分だけ
    • 入力エラーが1つでもある場合は「エラーがあります」と表示
    • エラーのあるコントロールにフォーカスを当てると、メッセージエリアのテキストが、当該コントロールのエラーの説明に切り替わる

いくぶんレガシーな画面設計だが、基幹系の業務アプリケーション等、エラーの表示領域が限られている場合に使えまいかと考えている。

試したこと

試しに、要件を満たすデモを作って Plunker に上げた。 動きは以下の通り。

  • 適当に入力して「登録」ボタンを押すと、そのタイミングで入力チェックが走り、エラーがある場合は画面上部にうやうやしく設置された1行分のメッセージエリアに「エラーを直せ」的な命令が出現する。
  • さらにエラーのあるコントロールがこの季節らしいピンク色に染まり、只ならぬ雰囲気を放つ。
  • そして、ピンクと化したコントロールにフォーカスを当てると、メッセージエリアの内容が書き換わり、何が問題なのかを具体的に指摘してくれる。

Plunker は、どういうわけか 初期表示がアホみたいに遅いのと、Chrome 以外のブラウザでは表示がバグってしまうというダブルの欠陥がある。 閲覧環境によっては左側に無駄なスペースが表示されているかも知れない(iPhone + Safari だと表示すらされないかも知れない)。

  • 要件を実現するためReactiveフォームを使用した
    • フォーカス状態をプロパティに持てるよう、FormControlDirective および FormControl のサブクラスを作った

困っていること

とりあえず動きはするが、いろいろ実装上まずい点がある。

  • input タグに、ngDefaultControl ディレクティブをいちいち指定しなくてはならなくなった
  • バリデーションエラーのコントロールに対して、ng-invalid クラスが自動で設定されなくなった(致命的)

そもそも、FormControlDirective を拡張する際のベストプラクティスが分からん。

7つの習慣を学んでみる(その1)

はじめに

唐突だけど、僕はずっと自分に自信がなかった。 というか今もない。 弱気で、グズで、ちょっとでも強い叱責を受けるとすぐに怯んでしまう。 ときどき自分の言動が正しいかどうか不安になることすらある。

自信がないから、僕はいつも上層部の言いなりだ。 それでいて「自分のやりたい仕事ができない」などと考えるどうしようもなさも持ち合わせている。

そんな僕の転機は、ある日突然訪れた。

どうやら、今回の人事考課で昇進候補者として選出されたらしい。 ── にも関わらず、自分は職権と責任を負う自覚が持てずにいる。 このままではいけないと、今の自分の在りように対して俄かに危機感が湧きあがった。

僕と7つの習慣

そんな折、新人時代に研修でちょっとだけ教わった『7つの習慣』というものをふと思い出した。

7つの習慣』は、スティーブン・R・コヴィーによるベストセラーの自己啓発本だ。 あまりにもメジャーすぎて、おそらく多くの方が一度は耳にしたことがあると思う。

この本が巷に溢れる類書と大きく異なるのは、時代や文化に左右されない普遍の「原則」を意識して書かれている点である。 仕事のコツとか小手先のテクニックなど一過性の成功論は書かれていない。

僕はハッタリで誤魔化ごまかすやり方があまり好きではない。 中身がないのに虚勢を張っても、心身を消耗するばかりで誰も幸せにならないからだ。

その場凌ぎの付け焼き刃ではなく、自分の人格を内から育ててもうちょっと自信をつけたいと思い、『7つの習慣』を読んでみることにした。

そんなわけで、今日から数回に亘って内容を紹介していこうと思う。

※ この記事は決して特定の思想や信条を強制するものではありません。

インサイド・アウト

もし今、なんだかうまく行かないなーと感じているなら、自分の根底にある「物の見方」を変えてみる必要があるかも知れない。

自分がいつまでも同じ見方をしている限り、自分の周りの問題はいつまで経っても同じ形をしたままだからだ。

その賢い頭をちゃんと使うんだよ。 見方を変えてみるんだ。

出典: 映画「ベイマックス

見方を変えると、行動が変わる。 行動が変わると、結果が変わる。 場当たり的に行動だけを変えるのではなく、もっともっと自分の内面の深いところで価値観を支配しているパラダイムから変えてみよう。 ── というのがインサイド・アウト内から外へというアプローチだ。

f:id:tercel_s:20171228211503p:plain:w400
出典: 桑田乃梨子だめっこどうぶつ 1」竹書房

ただし、インサイド・アウトで身の回りの問題がいきなりすべて解決するわけではない。

レベル1の駆け出し勇者が、功を焦っていきなりラスボスに戦いを挑んでもろくなことにならないし、経験値を上げずに装備ばかりを固めてもあまり意味がない。

それと同じように、人間の人格的な成長には段階があり、発揮できる力もそれぞれの段階において大きく異なる。 しかも、成長過程はどれ一つとしてスキップできない*1

というわけで。

僕はこれから、自分の成長に応じて、内面を見つめ直す 7つの習慣*2を段階的に身につけていく。

第1の習慣「主体的である」

実は、他人の許しを得なくても、僕たちには(あくまで責任の範囲内で)自分で行動を選ぶ自由がある。

なのに僕は、大事な決断を他人任せにしたり、状況に流されてばかりいたせいで、どうしてもここ一番というところで決定力が弱い。

現在の自分の姿は、今までの自分の選択と行動の結果なのだ。

f:id:tercel_s:20171225225255p:plain:w200
出典: 桑田乃梨子だめっこどうぶつ 1」竹書房

そもそも主体性ってなんだろう

主体性とは、自発的に率先して行動するだけを意味するのではない。 人間として、自分の人生の責任を引き受けることも意味する。 私たちの行動は、周りの状況ではなく、自分自身の決定と選択の結果である。

出典: スティーブン・R・コヴィー「完訳 7つの習慣 - 人格主義の回復」キングベアー出版

ここに書こうか非常に迷ったけれど、実は数ヶ月前、僕は取引先からの信頼を失いかねない大失敗をしてしまった。 今回ばかりは心底こたえた。

どれだけ打ちひしがれても、過去に戻って失敗を防ぐことはできない。

惨めな帰り道。

電車の中で、唐突に今この瞬間からの行動は僕自身の意志で自由に選ぶことができることを悟った。 突然、降って湧いたのだ。

たしかにつらくて仕方ないのだけど、でも今なら自分をラクにしてやることも、あるいは問題と向き合って根本解決に向けて動くこともできる。

さらに見方を変えれば、実は僕がいるところは思っていたほど窮境ではない ── かも知れない。

f:id:tercel_s:20171225225319p:plain:w200
出典: 桑田乃梨子だめっこどうぶつ 2」竹書房

関心の輪と影響の輪

主体的でない人は、「関心はあるけど、自分ではどうにもできないこと」に多くの労力を割いてしまう。

たしかに僕も、ライバルへの嫉妬や劣等感に悶えて何も手につかなくなることが何度もあった。 ついさっきだって、自分の失敗を悔やんでいた。

そんなことをぐだぐだ悩んでも状況はなにひとつ変えられないのに。

f:id:tercel_s:20171226001032p:plain:w200
出典: 桑田乃梨子だめっこどうぶつ 2」竹書房

一方、主体的な人は、「自分が影響力を発揮できること」「自分でコントロールできること」に多くの労力を費やすという。

もちろん、主体性は必ずしも思い通りの結果をもたらすとは限らない。 選択できるのはあくまで自分の行動だけだからだ。

でも。

少なくとも、無意味な苦しみを無駄に味わうことは減る。

主体性の発揮

単発的な成功体験だが、先日(2018/03/30)、主体性を発揮する局面があった。

残念ながら、弊社にはソフトウェアテストの結果を Excel に貼り付けて納品物に添えるという悪しき文化が残っている。 根拠は無いが、黒幕は IPA だと思っている。

僕は働き方を変えたいのだ。 エンジニアが本来能力を発揮すべき領域にリソースを割けるよう、退屈で機械的な単純労働はとことん自動化していくべきだと考えている。

しかし今までは、『指示されたことを指示された通りに遂行すればよい』という立場だったため、面倒が増えないよう、余計な提言を避けてきた。

だが、ついに先日「影響の輪」を広げる行動を自分で選ぶことができた。

僕は、自分のちいさな影響力を、さらなる上の立場の人間に伝播させることができた。

小さな一歩かも知れないけど、昔の僕より間違いなく「影響の輪」が広がっているな……と感じた。

繰り返しになるけど、自分自身の行動は自由に選ぶことができるのだ。

(つづく)

*1:7つの習慣』では、人間の人格的な成長の段階を 依存自立相互依存 の3つに分類している。 依存状態の人が、自立を飛び越えていきなり相互依存の境地に達することはできない。

*2:7つの習慣』では、「知識」「スキル」「意欲」の3要素が重なりあった領域を習慣と定義している。 言い換えると、習慣を身につけるには、「何をするのか、なぜするのか(知識)」「どうやってするのか(スキル)」「それをしたい(意欲)」という3つが揃わないといけない。

眠れない

いろいろ思うところはある。

ただ、どれだけ思い詰めても自分の力では絶対に動かせないこともある。

諦めなくてはならないこととか、変えようのない過去とかには、あまり拘りすぎない方がいい。

そういうことに、貴重な労力を費やすのは無駄なんだ(´・ω・`)

広告を非表示にする

命ある限り

特に推敲もせず、つれづれなるままにだらだら書く。

2018年、あけましておめでとうございます。

僕は年末年始休暇を利用して地元に帰省し、実家で新年を迎えました。

半年ぶりの帰省でしたが、ちょっと見ない間に身の回りの世界が大きく変化していました。

祖父じいさんが介護福祉施設に入っていたり、かつて僕が密かに心を寄せていた人が結婚していたり ── なんというか、自分の中で大切にしていた「幸せな記憶」が時の流れに壊されてしまったような、言い知れない寂寥感に襲われました。

また、実家は一昨年から今日こんにちに至るまで立て続けの波乱に見舞われ、それはそれは大変な苦労をしているようでした。

せめて生活が少しでも豊かになればと両親に心ばかりの贈り物をし、後ろ髪を引かれる思いで東京に戻ってきました。

新幹線の中で、僕は情けない気持ちでいっぱいでした。

でも。

実家に帰ってわかったことが2つあります。

1つは、どんなに危機的状況でも、絶望さえしなければ存外物事はなんとかなるものだ、ということ。

もう1つは、うちの家族は強いということ。

僕だったら「諦めてラクになってしまおう」とつい考えるような状況でも、絶対に逃げないんだな……と。

それは「信じる力」の違いなのかも知れません。

いま、パソコンの前で改めて我が身を省みています。

僕の目の前にも多くの困難が立ちはだかっています。

他の誰でもない、僕自身が立ち向かわねばならないことばかりです。

逃げるわけにはいかないと思えば思うほど、自分で自分を追い詰めていました。

だけど、実は、自分で自分を追い詰める必要はまったく無くて、そもそも強い家族に囲まれて育った僕だって強いのではないか ── そう信じてみようかな、と思いました。

思えば今まで何度も危機的状況を切り抜けてきました。

そんなとき、無理に自分を追い詰める必要はなくて、できないことをやろうとする必要もなくて、できる範囲で最善を尽くせば必ずいとぐちは見つかると信じて進もうと、気持ちを新たにした新年なのでした。

広告を非表示にする

7つの習慣

思うところあって、「7つの習慣」を読んでいる。

もとより、この手の自己啓発本は苦手な方なのだが、この本だけは少し特別な思い入れがある。

いまは公私ともにおいしくない状況だ。 まだ差し支えのある案件なので詳細は伏すが、味方よりも敵の声が大きく、心が折れかけている。

これが自分ひとりだけの問題ならばまだしも、ステークホルダへの迷惑を考えるととてもいたたまれない気持ちになる。

自分を変えなくては──という切実でありながらも漠然とした焦燥に駆られ、気付けば本屋にいた。

手にしたのは「 7つの習慣」の原典である(以前、コミック版を購入したが、密度が全く違う)。

寝る前の僅かな時間を利用して少しずつ読み始めており、今は内容を自分なりに咀嚼しているところである。

広告を非表示にする

自分を変えたい

最近、好むと好まざるとに関わらず、仕事でリーダシップ的な何かを示さねばならない局面が増えてきた。

周囲の人を不安にさせないために、まず自分に自信を持てるようにならねばという切迫感に近い思いに駆られている。

広告を非表示にする

風邪を引いた

先週からずっと風邪を拗らせている。

火曜日に午前半休、木曜には声が出なくなり、金曜はとうとう出社不能になった。

床に伏せって色々考えているうち、自分にとってやりたい事が思いのほか多いことに気づいた。

そして、それらをすべてやるにはあまりにも自由な時間が足りない事も分かった。

受験生だった頃も、実は受験勉強よりもやりたい事があった。 受験が終わったら好きな事ができるようになるかと思ったが、そういうわけでもなかった。

今も似たような状況だ。 本気でやりたいならば、自由な時間ができるのを待っていては遅すぎる。

そうこうしているうちに、頭の中がいっぱいになった。

医者から貰った大量の薬を飲むと、たちまち眠くなる。 何を置いてもまずは体調の快復だ。

あまり取りとめのない話になってしまったが、いったんこのへんで投稿しておく。

広告を非表示にする