JHipster一知半解- 4.5.4 ng-jhipster

回文集目录:JHipster一知半解

管道pipe目录（各种自定义管道，多而不难）

capitalize.pipe.ts（格式化字符串，首字符大写，其他小写）

管道定义为“capitalize”，先把字符串(input)都toLowerCase()转换为小写，然后截取首个字符toUpperCase()，拼接后面的。显然，中文字符不适用这个管道。

filter.pipe.ts

管道定义为“filter”，

• 首先这里定义了pure为false，官方解释为

    /**
     * Declare reusable pipe function.
     *
     * A "pure" pipe is only re-evaluated when either the input or any of the arguments change.
     *
     * When not specified, pipes default to being pure.
     */

pure的管道，仅当值或者参数变化时候会重新计算值，默认值为true。

• 其次，定义了各种类型的filter方法（filterByStringAndField，filterByString，filterDefault，filterByObject，根据不同的类型过滤内容。

• 最后，实现了transform()方法

//三个参数，第一个是需要过滤的数组，第二个是过滤类型，第三个是指定过滤的field
transform(input: Array<any>, filter: string, field: string): any {
        if (!filter) {
            return input;
        }
        //根据filter的type调用不同的函数
        const type = typeof filter;
        if (type === 'string') {
            if (field) {
                return input.filter(this.filterByStringAndField(filter, field));
            }
            return input.filter(this.filterByString(filter));
        }

        if (type === 'object') {
            return input.filter(this.filterByObject(filter));
        }
    }

keys.pipe.ts

管道定义为“keys”，从对象values中，只选取在第二个参数keys数组中的属性，构造一个新的map型数组，遍历时候用。
具体可参考health-modal.component.html

order-by.pipe.ts

管道定义为“orderBy”，根据传入数组对象，条件（判定用的属性），升/降顺序，对数组进行排序，并返回排序后的数组。（有副作用的，在原数组操作）
具体可参考configuration.component.html

<tr *ngFor="let entry of (configuration | pureFilter:filter:'prefix' | orderBy:orderProp:reverse)">

对configuration先调用pureFilter过滤，然后用orderBy排序（排序条件为orderProp，升/降顺为reverse）。
顺带一记：管道使用时用":"隔开多个参数，第一个参数为|之前的值(隐含必须有)，而在管道名后面的的":"隔开的多个值，就分别对应transform()方法的第二个，第三个...参数。

truncate-characters.pipe.ts

管道定义为“truncateCharacters”，截断指定长度的文本，并在后面加上"..."作为省略号标志，另外还能选择breakOnWord，如果为否，后找到下一个空格在截（个人感觉应该加上其他结束符，比如","","."等。

truncate-words.pipe.ts

管道定义为“truncateWords”，功能与“truncateCharacters”类似，不同的是这个是按照指定文本的单词数量进行截断的，既然是按照单词截，也就没有breakOnWord的问题了。

服务service目录

方便使用（可注入）的各种通用服务，仅仅包含数据层的抽象，不包含展现层。

alert.service

暴露“JhiAlertService”服务，内部有一个了alerts数组，可以通过factory构造一条laert内容，并且定时调用closeAlert清理掉。这样展现层，只需要要使用JhiAlertService服务，展示其中数据即可。
JhiAlert类型：一个alert的模型，有id，类型，消息值等参数。

• 默认的timeout是5秒，这个是写死了，是否可以通用配置(JhiConfigService)，或者构造时候传入，以提高适应性？
• sanitizer (待补充)

base64.service.ts

暴露“JhiAlertService”服务，提供对字符串的base64编/解码功能，目前也没有用到

data-util.service.ts

暴露“JhiDataUtils”服务，对数据（字符串，文件，图像）等的处理工具包，计算大小，打开文件等
目前仅在测试中用到

date-util.service.ts

暴露“JhiDateUtils”服务，进行日期的格式化，默认格式为：

private pattern = 'yyyy-MM-dd';

包含convertDateTimeFromServer(date: any)、convertLocalDateFromServer(date: any)、convertLocalDateToServer(date: any, pattern = this.pattern)方法。
这里有在ts中使用管道pipe的用法例子

//构造方法中，new出一个管道
constructor() {
        this.datePipe = new DatePipe('en');
    }
//使用管道格式化日期
convertLocalDateToServer(date: any, pattern = this.pattern) {
        if (date) {
            const newDate = new Date(date.year, date.month - 1, date.day);
            return this.datePipe.transform(newDate, pattern);
        } else {
            return null;
        }
    }

自己new一个管道，然后调用其中的transform方法。

event-manager.service.ts

暴露“JhiEventManager”服务，利用Rxjs,实现了一个通用的订阅模型，作为通用的消息传递机制。在项目中大量使用。
内部构建一个observer,然后通过订阅、广播进行事件传递。

    broadcast(event) {
        if (this.observer != null) {
            this.observer.next(event);
        }
    }
    subscribe(eventName, callback) {
        const subscriber: Subscription = this.observable.filter((event) => {
            return event.name === eventName;
        }).subscribe(callback);
        return subscriber;
    }

pagination-util.service.ts

暴露“JhiPaginationUtil”服务，分页工具，解析升/降序，页码，排序条件。
目前仅user-management.component.ts中用到。

parse-links.service.ts

暴露“JhiParseLinks”服务，提供解析url连接中地址，参数等信息，返回一个links对象。