2

興味深い Angular 検証の問題が発生しています。ラジオ ボタンが選択されていることを確認する必要があります (ロード時にデフォルト値がない可能性があります)。ラジオ ボタンの値は、 を使用して配列から反復処理されますng-repeat。ng-repeatこのすべては、ユーザーのリストに対して別の内部でも発生します。

問題は、関連するラジオ ボタンの各グループに一意/動的name属性を設定する必要があることです。そうしないと、1 つを選択すると、別の行の他の選択が解除されます。属性に基づく検証で、この一意/動的な名前を必要な式と式で使用する方法が見つからないようです。nameng-classng-show

これは機能していません: ng-show="userFormRow.service-{{$index}}.$invalid"

コンテキスト内のコードのサンプルを次に示します。

<table class='table table-striped table-bordered'>
    <tbody>
      <tr ng-repeat="u in users"
          ng-form="userFormRow">
        <td>
          <!-- THIS is having an issue determining the name of this form item since I need to generate a dynamic one here-->
          <div class="form-group"
               ng-class="{'has-error': userFormRow.service-{{$index}}.$invalid }">
            <label class="control-label center-block">Service</label>
            <div class="radio-inline" ng-repeat="o in serviceOptions">
              <label>
                <!-- HERE is where I define the unique name attribute based on the index of the table repeater -->
                <input type="radio"
                       name="service-{{$parent.$index}}"
                       value="{{::o}}"
                       ng-model="u.Service"
                       ng-required="!u.Service"> {{::o}}
              </label>
            </div>

            <!-- THIS is having an issue determining the name of this form item since I need to generate a dynamic one here-->
            <p class="help-block" ng-show="userFormRow.service-{{$index}}.$invalid">A service must be selected!</p>
          </div>
        </td>
      </tr>
    </tbody>
  </table>

そして、ここに完全なコード例があります。http://codepen.io/chrismbarr/pen/eNoGLJ?editors=101 コンソールでエラーを確認する

4

1 に答える 1