車輪開発大好きおたいがです。こんにちは。(挨拶) AngularJS ディレクティブ開発の練度を高めるため、掲題通りのコンポーネントを作ってみました。名前は 'cmEditableText' とでもしておきます。 たとえば <p> 要素のテキストをマウスでダブルクリックしたときに <input type="text"> 要素に差し替かわり編集可能状態になり、編集を終えてフォーカスを解除したときには入力値が <p> 要素に適用される…という仕掛けになっています。 デモ 完成品はこちらです。 ディレクティブのタイプ、および、ngModel 連携 元々配置されていた <p> 要素や <td> 要素をお手軽に編集可能にするという設計思想に基づいて作ったため「属性 (Attribute) タイプ」に指定しています。 また、モデルとのバインディングを保持するために ngModel を必須属性としており