1

これが AngularJS で機能しないのはなぜですか?

<div class="inputbox" ng-repeat="publisherParam in publisherParams">
    <div>
        <label>{{ publisherParam.label }}</label>
    </div>
    <div>
        <input type="text" name="{{ publisherParam.label }}" ng-model="{{ publisherParam.label }}" required />
    </div>
</div>
<div class="submitbox">
    <button class="purple-btn" ng-disabled="publisherForm.$invalid">
        Add Network
    </button>
</div>
4

2 に答える 2

3
  1. {{ }}で使用するべきではありません。次のng-modelように記述してください。ng-model="publisherParam.label"
  2. 入力の名前に式を使用することはできません。フィールド レベルの検証をサポートするには、静的な文字列である必要があります。

jsFiddle を共有していただければ、実際のコードについてさらにお手伝いさせていただきます。

于 2012-10-11T15:35:47.300 に答える
0

ng-repeat と $index を使用して、フォーム入力フィールドの名前に入れる項目のインデックスを取得したいようです。あなたが何をしようとしているのか正確にはわかりませんが、うまくいけば、これがあなたを正しい方向に導きます...

編集: また、Angular でフォームを送信する場合、入力の name="" は無関係です。$scope で変更しているオブジェクト全体を取得し、AJAX 経由で送信できるためです。

HTML

 

<form name="publisherForm" ng-submit="formSubmit()">
    <div class="inputbox" ng-repeat="publisherParam in publisherParams">
        <div>
            <label>{{publisherParam.label}}</label>
        </div>
        <div>
           <!-- use $index to get the index of the item in the array -->
           <!-- note, no {{}} inside of the ng-model tag. 
               That's being $eval'ed so no {{}} needed -->
            <input type="text" name="publisherParam_label_{{$index}}" ng-model="publisherParam.label" required />
        </div>
    </div>
    <!-- just an add button so you can see it work -->
    <button type="button" ng-click="addPublisherParam()">Add</button>
    <!-- your submit button -->
    <div class="submitbox">  
        <button class="purple-btn" type="submit ng-disabled="publisherForm.$invalid">
            Add Network
        </button>
    </div>
</form>

JS

app.controller('YourController', function($scope) {
   //this is the array you're displaying
   $scope.publisherParams = [
       { label: 'First Label' },
       { label: 'Second Label' }
   ];

   //just an indexer
   var p = 0;
   $scope.addPublisherParam = function(){
       //add a new publisher param.
       $scope.publisherParams.push({ label: 'New Label ' + p++ });
   };

   $scope.formSubmit = function(){
       //do something here.
   };
});
于 2012-10-11T16:32:10.337 に答える