1つのコンポーネントVS 3つのコンポーネントを追加/表示/編集オブジェクトを角度2？

Question

私はオブジェクトを表示、追加、更新するためにユーザーを有効にする必要があります。私はAngular 2プロジェクトに3つのコンポーネントまたは1つのコンポーネントを持つという決定を下す必要があります。

オプション1：一つの成分

• プロ：容易データ共有（DRY）。
• 短所：巨大なテンプレート。 3つのコンポーネント
  • 長所に分割：

  オプション2もSRPは、小さなテンプレートを割りました。

• 短所：データ共有オーバーヘッド（カスタムイベント..）。

このような状況をどのように処理しますか？どちらのオプションを使うのがよいでしょうか？ 3番目のオプションはありますか？

Answer 1

アクションをトリガーするコンポーネントは1つだけで、編集UI、1つまたは3つのコンポーネントがどのくらい正確に表示されているかによって異なります。その上

if (evt === 'edit') { do something edit-ish... } 
if (evt === 'add') { do something add-ish... } 
if (evt === 'delete') { do something delete-ish...} 

そして：

ボタンは、ハンドラにこのようなものを「モード」プロパティを送信します。実際の編集フィールド自体は、テンプレートのいくつかのプロパティを切り替えることができます（たとえば、入力フィールドのスタイルを "editable"に変更する、おそらくディレクティブを使用する）か、何か本当に精巧な作業を行っている場合はおそらくそうです別のコンポーネントを作成します。

重要なのは、別の開発者が簡単に解読できることです。 「それらすべてを支配する1つの要素」が妥協するならば、その選択は明らかです。それを分解してください。