[英]JHipster: Filtering entities with criteria - intended Angular client-side approach
I've recently started using JHipster - thanks to the maintainers for this fantastic project! 我最近开始使用JHipster - 感谢这个梦幻项目的维护者!
In the current version of JHipster (4.10.2 at the time of writing), entities can have filtering enabled via the entity sub-generator, or by including filter EntityName
and service EntityName with serviceClass
to the project's JDL file. 在当前版本的JHipster(编写本文时为4.10.2)中,实体可以通过实体子生成器启用过滤,或者将filter EntityName
和service EntityName with serviceClass
一起包含到项目的JDL文件中。 This produces a Spring project in which the getAllEntities()
method in the EntityNameResource
class takes a Criteria
argument constructed from the URL GET
params. 这将生成一个Spring项目,其中EntityNameResource
类中的getAllEntities()
方法采用从URL GET
参数构造的Criteria
参数。
This works out-of-the box with the Swagger UI generated for the endpoint, and the queries issued by this UI demonstrate that the back-end expects each criterion to be in the form of a GET
parameter key-value pair; 这与为端点生成的Swagger UI开箱即用,并且此UI发出的查询表明后端期望每个条件都采用GET
参数键值对的形式; this is consistent with the 4.10.2 Filtering docs . 这与4.10.2过滤文档一致。
However, I wonderd whether there is an intended approach to using this from a front-end Angular project that I have missed, beyond making appropriate modifications oneself to construct a conforming URL. 但是,我想知道是否有一个预期的方法来使用我已经错过的前端Angular项目,除了自己进行适当的修改以构建一致的URL。
The front-end services use the static function createRequestOption(req)
(exported from app/shared/model/request-util.ts
) to populate the GET
parameters for paging and sorting. 前端服务使用静态函数createRequestOption(req)
(从app/shared/model/request-util.ts
)来填充GET
参数以进行分页和排序。 This function also expects that the passed-in req
object may have a query
attribute; 此函数还期望传入的req
对象可能具有query
属性; initially, I thought that populating this parameter was the intended way to use the back-end filtration. 最初,我认为填充此参数是使用后端过滤的预期方式。
However, the implementation of createRequestOption(req)
currently places the value of req.query
into a GET
parameter called query
; 但是, createRequestOption(req)
的实现当前将req.query
的值放入名为query
的GET
参数中; ie this does not produce the query format expected by the back-end, which expects a separate GET
parameter per criterion. 即,这不会产生后端预期的查询格式,后者需要每个标准单独的GET
参数。
The solution which I have used is to modify createRequestOption(req)
to expect an array of key-value pair objects instead of req.query
(I've called it req.criteria
), and add these to the URLSearchParams
's array (it has to be the array, not the map, since there may be multiple parameters with the same key, eg name.in=Megatron&name.in=Optimus
). 我所使用的解决方案是修改createRequestOption(req)
到期望键值对对象的数组代替req.query
(我称之为req.criteria
),而这些添加到URLSearchParams
的阵列(它必须是数组,而不是地图,因为可能有多个具有相同键的参数,例如name.in=Megatron&name.in=Optimus
)。
So I've changed: 所以我改变了:
params.set('query', req.query);
to: 至:
if (req.criteria && req.criteria.length > 0) {
req.criteria.forEach((criterion) => {
params.append(criterion.key, criterion.value);
});
}
...with component code populating the array along the lines of the following: ...使用组件代码沿着以下行填充数组:
let criteria = [
{key: 'name.equals', value: 'Optimus'},
{key: 'power.equals', value: '10'}
];
this.entityService.query({
page: this.page - 1,
size: this.itemsPerPage,
sort: this.sort(),
criteria
});
I just created an example of this working in practice with some form fields filtering a test single-entity monolithic app (currently equals queries only) with this approach in GitLab here . 我刚刚创建的一些表单字段筛选测试单一实体单片应用实践中,这种工作的一个实例(目前仅相当于查询)这种方法在GitLab 这里 。
So, my questions are: 所以,我的问题是:
req.query
in the current implementation of request-utils.ts
? req.query
在request-utils.ts
的当前实现中request-utils.ts
什么? Many thanks. 非常感谢。
I've done very similar thing in my projects too, in my solution the criteria is used like this: 我在我的项目中也做了非常类似的事情,在我的解决方案中,标准使用如下:
let criteria = {
'name.equals' : 'Optimus',
'power.equals' : '10'
};
Currently, I work on an 'auto-complete' field, which will use the criteria, and has the necessary extension to the request-util.ts. 目前,我正在使用“自动完成”字段,该字段将使用条件,并具有request-util.ts的必要扩展。 Here: https://github.com/jhipster/generator-jhipster/pull/6618 这里: https : //github.com/jhipster/generator-jhipster/pull/6618
And yes, I think, that parameters of that 'query' method is bit confusing, it need to be be simplified a bit. 是的,我认为,那个'查询'方法的参数有点令人困惑,需要稍微简化一下。
Maybe, we can generate a client side version of the 'EntityCriteria.java', as 'entity-criteria.ts', but I'm not sure. 也许,我们可以生成'EntityCriteria.java'的客户端版本,作为'entity-criteria.ts',但我不确定。 There is a constant push against new features, and less code, which I could understand. 不断推动新功能和更少的代码,我能理解。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.