動態表單名稱和ng-repeat

我需要基於從服務器獲取的動態列表在頁面上創建多個表單。爲了做到這一點，我試圖用角ng-repeat像這樣：動態表單名稱和ng-repeat

<tr ng-repeat="row in data.rows" ng-show="row.edit" class="edit_row" style="border: 0;"> 
    <td> 
     <div class="col-lg-9"> 
      <form method="POST" class="form-horizontal" enctype="multipart/form-data" name="{{ row.row_id }}"> 
       ... 
       <input ng-disabled="{{ row.row_id }}.$invalid" value="Save" name="submit" type="submit" ng-click="collection.save_edit(row.row_id);"> 
      </form> 
     </div> 
    </td> 
</tr>

這並不會達到預期效果 - 形式已經產生了name屬性正常，但角度不撿這件事。有沒有辦法用動態名稱創建表單？或者是否有解決此問題的解決方法？

我想到的唯一想法是以某種方式創建FormControllers以及data.rows並在ng-repeat中使用它們，但我找不到辦法做到這一點。

來源

2015-01-01 mmoron

你是什麼意思「角沒有選擇這個」？ – Claies

我的意思是我無法找到一種方法來將'FormController'傳遞給'save_edit'方法，在提交點擊時調用（如果我使用它的硬編碼名稱）。另外我找不到綁定到這個表單的'。$ invalid'屬性的方法。 – mmoron

您可以從$ scope方法的this上下文中訪問表單對象，該方法無論如何都會代表子範圍。由於它是動態表單名稱，因此您將傳遞表單名稱，並且表單控件將始終附加到與表單名稱相同的範圍。所以你可以通過在該方法上訪問它或在視圖上明確使用$scope[row.row_id].$invalid來枯萎。爲了安全起見，我使用ng-attr-name來擴展插值並動態設置表單名稱。

/*Get form object on save*/ 
    $scope.save_edit = function(form){ 
    console.log(this[form]); 
    } 

    /*Returns whether the form is valid or not*/ 
    $scope.isInvalid = function(form){ 
    return this[form].$invalid; 
    }

和你的形式也只是：

<form novalidate method="POST" class="form-horizontal" enctype="multipart/form-data" 
     ng-attr-name="{{ row.row_id }}"> 
    <input type="text" name="test" ng-required="true" ng-model="row.test"/> 
    <input ng-disabled="isInvalid(row.row_id)" value="Save" name="submit" 
      type="submit" ng-click="save_edit(row.row_id);"> 
</form>

Demo

邊注：爲了更加具體和分離出來，你可以將這些以另一個形式的特定功能控制器並在ng-repeat級別設置ng-controller，您可以使用$scope而不是this。

來源

2015-01-01 23:36:34 PSL

謝謝。我是新來的角和由於某種原因，我沒有意識到我可以綁定到一個函數的結果:-)。你還提到我可以在view_上顯式使用'$ scope [row.row_id]。$ invalid'，但是當我嘗試這樣做時：'ng-disabled =「$ scope [row.row_id]。$ invalid 「它不起作用。我錯過了什麼嗎？ – mmoron

動態表單名稱和ng-repeat

回答

相關問題