1

指定した要素の入力フィールドに入力した内容をリアルタイムで更新する基本的な角度スクリプトを使用しました...

  <!doctype html>
  <html ng-app>
    <head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    </head>
    <body>
      <div>
        <label>Name:</label>
        <input type="text" ng-model="yourName" placeholder="Enter a name here">
        <hr>
        <h1>Hello {{yourName}}!</h1>
      </div>
    </body>
  </html>

私はAngularが初めてです。これを5月のレールアプリで使用しました。しかし問題は、私が ng-model を使用したフィールドが、送信後にその値をリセットすることです。「値」属性を設定しても機能しません。どうすればこれを修正できますか?

私のレールアプリケーションから生成された正確なコード:

<form accept-charset="UTF-8" action="/members" class="custom" id="new_member" method="post">

      <div class="row collapse text-field">
        <div class="small-4 columns">
          <h3>Add Member : </h3>
        </div>
        <div class="small-6 columns left inline">
          <h3 class="subheader inline">&nbsp;{{newEntry.name}}</h3>
        </div>
      </div>



        <div class="row collapse text-field">
          <div class="small-3 columns"> 
            <label class="prefix" for="member_name">Full Name</label>
          </div>
          <div class="small-7 columns left">
            <input class="input" id="member_name" name="member[name]" ng-model="newEntry.name" type="text" value="gj" />
          </div>
        </div>


        <div class="row collapse text-field">
          <div class="small-3 columns"> 
            <label class="prefix" for="member_address">Address</label>
          </div>
          <div class="small-9 columns">
            <textarea class="input" height="115" id="member_address" name="member[address]">
            </textarea>
          </div>
        </div>

        <div class="row">
          <div class="small-9 columns" ><input class="button radius" name="commit" type="submit" value="Add Member" /></div>
        </div>
</form>

注: ng-controller は使用していません。私はAngularが初めてです。必要な場合は、上記をコントローラーに変換する方法を教えてください。フィールドの値を取得して、Rails のフォームに送り返すことができます。変数にあります。しかし、Angularはそれを拭き続けます!

注 2 : この問題は、私が angular-model を使用した入力フィールドに対してのみ持続します。他のすべてのフィールドはデータを保持していました!

4

1 に答える 1