npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

jd-acl

v0.0.7

Published

| 方法 | 说明 | | --- | --- | | `[change]` | 监听ACL变更通知 | | `[data]` | 获取所有ACL数据 | | `setFull(val: boolean)` | 标识当前用户为全量,即不受限 | | `set(value: ACLType)` | 设置当前用户角色或权限能力(会先清除所有) | | `setRole(roles: string[])` | 设置当前用户角色(会先清除所有) | | `setAbility(abilities:

Readme

API

ACLService

| 方法 | 说明 | | --- | --- | | [change] | 监听ACL变更通知 | | [data] | 获取所有ACL数据 | | setFull(val: boolean) | 标识当前用户为全量,即不受限 | | set(value: ACLType) | 设置当前用户角色或权限能力(会先清除所有) | | setRole(roles: string[]) | 设置当前用户角色(会先清除所有) | | setAbility(abilities: (number | string)[]) | 设置当前用户权限能力(会先清除所有) | | add(value: ACLType) | 为当前用户增加角色或权限能力 | | attachRole(roles: string[]) | 为当前用户附加角色 | | attachAbility(abilities: (number | string)[]) | 为当前用户附加权限 | | removeRole(roles: string[]) | 为当前用户移除角色 | | removeAbility(abilities: (number | string)[]) | 为当前用户移除权限 | | can(roleOrAbility: ACLCanType) | 当前用户是否有对应角色 | | canAbility(ability: ACLCanType) | 当前用户是否有对应权限点 |

ACLType

| 属性 | 类型 | 说明 | 默认 | | --- | --- | --- | --- | | [role] | string[] | 角色 | - | | [ability] | number[], string[] | 权限点 | - | | [mode] | allOf, oneOf | allOf 表示必须满足所有角色或权限点数组算有效oneOf 表示只须满足角色或权限点数组中的一项算有效 | oneOf |

示例

角色名

按钮必须拥有 user 角色显示
<button [acl]="'user'"></button>
按钮必须拥有 user 或 manage 角色显示
<button [acl]="['user', 'manage']"></button>
按钮必须拥有 user 和 manage 角色显示
<button [acl]="{ role: ['user', 'manage'], mode: 'allOf' }"></button>

权限点

按钮必须拥有 10 权限点显示
<button [acl]="10"></button>
另一种写法
<button acl [acl-ability]="10"></button>
按钮必须拥有 10 和 11 权限点时显示
<button [acl]="{ ability: [10, 11], mode: 'allOf' }"></button>

写在前面

路由守卫是指,当用户进入路由前若不满足权限时是无法进入。

路由守卫需要单独对每一个路由进行设置,很多时候这看起来很繁琐,@jd/acl 实现了一个通过守卫类 ACLGuard,可以在路由注册时透过简单的配置完成一些复杂的操作,甚至支持 Observable 类型。

示例

import { of } from 'rxjs';
import { ACLGuard } from '@jd/acl';
const routes: Routes = [
    {
        path: 'guard',
        component: GuardComponent,
        children: [
            // 角色限定
            { path: 'auth', component: GuardAuthComponent, canActivate: [ ACLGuard ], data: { guard: 'user1' } },
            { path: 'admin', component: GuardAdminComponent, canActivate: [ ACLGuard ], data: { guard: 'admin' } }
        ],
        // 所有子路由有效
        canActivateChild: [ ACLGuard ],
        data: { guard: 'user1' }
    },
    // 权限点限定
    { path: 'pro', loadChildren: './pro/pro.module#ProModule', canLoad: [ ACLGuard ], data: { guard: 1 } },
    // 或使用Observable实现更复杂的行为
    { path: 'pro', loadChildren: './pro/pro.module#ProModule', canLoad: [ ACLGuard ], data: { guard: of(false).pipe(map(v => 'admin')) } }
];