Angular JS 对象作为 ng-model 属性名称

Question

我正在创建一个动态 Angular js 应用程序，其中我想使用一个文本框作为表格过滤器的搜索文本。这是我正在做的事情的预览：

截至目前，我的代码如下所示

<table>
                <thead>
                    <tr class="filterrow">
                        <td data-ng-repeat="col in items.Properties">
                            <input id="{{col.DatabaseColumnName}}" type="text" 
                               data-ng-model="search_{{col.DatabaseColumnName}}"/> 
<!-- Above Here I want to dynamically assign the ng-model based on Databasecolumnname property-->
                        </td>
                    </tr>
                    <tr>
                        <th data-ng-repeat="col in items.Properties">{{col.ColumnTitle}}</th>
                    </tr>
                </thead>
                <tbody>
                    <tr data-ng-repeat="content in items2.Contents | filter: search_{{col.DatabaseColumnName}}: search_{{col.DatabaseColumnName}}">
                        <td data-ng-repeat="col in items.Properties">
                            <a href="#">{{content[col.Databasecolumnname ]}}</a>
                        </td>
                    </tr>
                </tbody>
            </table>

我已经尝试过使用 $compile 的方法，但我无法实现它。有什么想法吗？谢谢！

编辑：Plnkr - plnkr.co/edit/5LaRYE?p=preview

Answer 1

您可以通过为您的 ng-Models 设置基础对象来做到这一点。因此，在您的控制器中，您将拥有：-

 $scope.search = {}; 

并且在你看来：-

 <input ng-attr-id="{{col.DatabaseColumnName}}" type="text" 
                           data-ng-model="search[col.DatabaseColumnName]"/> 

这样，您的动态 ng-model 将被分配给搜索基础对象，例如：- 如果 col.DatabaseColumnName 是 col1 那么 ngModel 将是 $scope.search.col1