1

入力、選択、複数選択、ボタンなど、さまざまなフィールドを含むフォームがあります。そして、このフォームのコンポーネントを作成するのが良い考えである (そして実際に実行可能である) かどうか疑問に思っていました。このコンポーネントは、すべてのタイプのフォーム フィールド (入力、選択、ボタンなど) を含むことができるコンテナーのようなものです。 ）。

私はplunkerにコードのサンプルを置きました。私がしたいのは、フォーム用のコンポーネントを作成することです。そこには、必要な他のコンポーネント (ボタン、入力など) をいくつ挿入できます。

<!DOCTYPE html>
<html ng-app="MyApp">

<head>
  <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular.min.js"></script>
  <script src="script.js"></script>
  <script src="myInput.js"></script>
  <script src="myButton.js"></script>
</head>

<body ng-controller="MyCtrl">
  <div class="container">
    <h2>My form</h2>
    <form role="form">
      <my-input label="Firstname"></my-input>
      <my-input label="Lastname"></my-input>
      <my-button label="Submit"></my-button>
    </form>
  </div>
</body>

</html>
4

2 に答える 2

1

これら 2 つの質問に「はい」とマークした場合は、コンポーネントを作成する必要があります。

  1. 再利用可能ですか？
  2. フォームには独自のロジックがありますか?
于 2016-06-16T14:19:05.810 に答える
1

コードの他の部分でフォームを再利用する予定がある場合は、フォームをコンポーネントとして作成することをお勧めします。

それ以外の場合は、単なる好みの問題です。コードの大部分を別々のファイルに分割すると便利な場合があります。

編集: プランカーの例https://plnkr.co/edit/kyt9Q6L01r06dJXLDQZH?p=preview

<body ng-controller="MyCtrl">
  <div class="container">
    <my-form></my-form>
  </div>
</body>

編集 2: オブジェクトを属性としてフォームに渡す例で Plunker を更新しました

<body ng-controller="MyCtrl">
  <div class="container">
    <my-form inputlabels="inputs1"></my-form>
    <my-form inputlabels="inputs2"></my-form>
  </div>
</body>
于 2016-06-16T14:19:12.750 に答える