npm 包 ng-poller 使用教程

阅读时长 5 分钟读完

介绍

ng-poller 是一个基于 AngularJS 的轮询库,它可以帮助开发人员轻松地对服务器的状态更新进行监控。它提供了可配置的轮询机制,可以设定轮询间隔、成功或失败时的动作以及轮询主题。

安装

使用 npm 安装 ng-poller:

解释一下参数:

  • npm install:安装包的命令。
  • ng-poller:是你要安装的包的名称。
  • --save:将包名加入包的依赖中。

用法

在你的 AngularJS 应用中,你需要将 ng-poller 依赖注入到你的控制器中:

在控制器里声明一个 $poller 对象并配置它:

-- -------------------- ---- -------
-----------------------
    --------------------- ---------------- ------ -------- -
        -- -- -------
        --------------- - -----------------
            ------ ----- -- ----
            ------ ----- -- --------------- ----- ------
            ------- ----------- -- ------
            -------- -------------------------------------- -- -------------- ----- -----------
        ---

        -- -- -------- --
        ---------------------------------- ----- -------------- -
            -- ---- --------
            ----------- - -----
        ---

        -- -- -------- --
        -----------------------
    ---

解释一下代码中的参数:

  • $http:是 AngularJS 内置的 http 服务。
  • skyline:是 ng-poller 中一个预设好的配置,你也可以配置你自己的。
  • delay:轮询的时间间隔。
  • smart:智能轮询是指当用户在后台标签时,停止轮询,以减轻服务器的流量负担。
  • action:设置轮询行为。可以是 interval(一直轮询直到主题成功)、timeout(只轮询特定的次数)或 promise(轮询直到一个异步任务推出)。
  • promise:设置轮询任务,可以是一个 $http 请求或一个自定义函数。

示例代码

这是一个使用 ng-poller 的例子。先定义 html 页面:

-- -------------------- ---- -------
--------- -----
----- --------- ---------------
------
    ----- ----------------
    ---------------- ----------
-------
----- -----------------------

------------- -------

--- --------------- -- ------
    ------ --------- -------
-----

----- -----------------------------------

------- ---------------------------------------------------------------------------------
------- ------------------------------------------------------------------------------------------
------- -----------------------------------------------------------------------------------
------- ----------------------
-------
-------

再定义一个 JavaScript 文件 app.js

-- -------------------- ---- -------
----------------------- --------------
    --------------------- -------- -------- ------ -------- -
        -- ------
        --- -------- - ----------------------

        -- -- -------
        --------------- - -----------------
            ------ -----        -- ----
            ------ -----        -- --------------- ----- ------
            ------- ----------- -- ------
            -------- --------   -- -------------- ----- -----------
        ---

        -- ------------ ------ - ---- ---
        ---------------------------------- ----- -------- ------ -
            ----------- - -----
        ---

        -- -------------
        ---------------------------- -------- -- -
            -------------- - ----- -- ------
        ---

        -- ---------------
        ------------------------ -------- -- -
            -------------- - ------ -- ------
        ---
    ---

现在,启动一个本地服务器,并访问页面,你就可以看到轮询效果。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005570781e8991b448d3eea

纠错
反馈