Javascript 如何使用angularjs处理动态过滤添加的高级搜索？

以下是高级搜索的表单：

我能够为文档部分创建URL和参数，但我想不出处理“添加属性限制”部分的流程，因为属性最多可以添加5次，这取决于最终用户

如下图所示：

---

因此，我想在AngularJS中处理它，在运行中添加/删除和动态更改，并形成URL（GET/POST），将搜索数据发送到后端的API。

您可以使用模型中的对象数组来处理此问题

您的模型的结构将类似于

let dataModel = {
      'allwords': '',
      'exact_phrase':'',
      /// .. the rest of your basic search model variables

      'property_res': [ {'property':'','action':'contains','value':'','logical_operator':'and'} ]
}

在您的模板中，您将使用ng repeat of

dataModel['property\u res']

至于“addproperty”-您只需实现click处理程序，它将annother对象（与初始行具有相同的结构）附加到您的

dataModel['property\u res']

，ng repeat将处理其余部分

要获取POST请求的值，只需简单地遍历

dataModel['property_res']

数组并构造变量，或者只需将其JSON.serialize（）并在服务器端处理即可

希望这能让你走

编辑

添加ng重复渲染的示例：

var-app=angular.module（'app'，[]）；
app.controller（'mainController'，函数（$scope，$http）{
$scope.dataModel={
'property_res'：[{'property'：''，'action'：'contains'，'value'：''，'logical_operator'：'和'}]
}
$scope.addRow=函数（）{
$scope.dataModel['property_res'].push（{'property'：''，'action'：'contains'，'value'：''，'logical_operator'：'和'}）
}
$scope.showModel=function（）{
log（$scope.dataModel）
}
});

财产限制：
拾取属性
财产1
财产2
不包含
包含
或
和

添加行

控制台日志模型
如果您能用ng repeat在视图中演示如何执行此操作，我将非常高兴和感激，因为我不确定在高级搜索中如何使用动态添加和维护属性添加来执行此操作。我完全可以了解如何为POST数据生成json。我添加了angular 1示例片段来演示我的意思Perfect@mike\t。。。谢谢你的解释代码，它澄清了我的观点，甚至学会了一个新东西。。干杯，伙计：）