關於AngularJS和數據表組合

Question

首先，您好！ 我是新來的。

我最近在學習AngularJS和Web開發，因此我為我的新手表示歉意。 我偶然發現了與AngularJS進行數據表集成的各種障礙。 這是它的結構：

               <table class="datatable table table-hover">   
               <thead>
                    <tr>
                        <th ng-repeat="column in columns">          
                            {{column.name}}
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="form in forms | filter : {userName : activeFilter['user name']|rangeDate:activeFilter['range begin']:activeFilter['range end']:'birthDate'">
                        <td class="row-md-1">
                            <span ng-model="approvedForm.userName">
                                {{approvedForm.userName}}
                            </span>
                        </td>
                        <td class="row-md-1">
                            <span ng-model="approvedForm.birthDate">
                                {{approvedForm.birthDate}}
                            </span>
                        </td>
                    </tr>
                </tbody>
            </table>

我不得不提到，我在客戶端使用了過濾器，因此它們可以選擇正確的行。 問題是，在過濾某些用戶並使用數據表對行進行排序時，數據將在視圖上錯誤地復制，而我無法刪除它或任何其他東西。 為了解決這個問題，我必須取出ng-repeat過濾器，並使用支持數據表過濾器的過濾器。 有人知道是什么導致了這種行為嗎？

順便說一句我正在使用angularJS 1.x和數據表1.10

謝謝！

Answer 1

您的數據是重復的，因為您將其兩次綁定為HTML元素的屬性並帶有把手。 刪除代碼中的ng-model="..."屬性或{{...}} ，使其看起來像這樣：

<span>
  {{approvedForm.userName}}
</span>

由於@Shaishab Roy提到ng-model不應該與<span>因此請嘗試ng-bind ：

   <span ng-bind="approvedForm.userName"></span>