Have ideas to improve npm?Join in the discussion! »

    ractive-promise-alt

    0.5.3 • Public • Published

    ractive-promise-alt

    Adaptor for Ractive that allows you to watch for a Promise's result and status.

    Find more Ractive.js plugins at docs.ractivejs.org/latest/plugins

    Status

    /* here's a function that returns a promise. */
    function getUser() {
      return $.get('/api/user');
    }
     
    = new Ractive({
      adapt: ['promise-alt']
    });
     
    /* you'll then be able to consume the promise via ractive.set. */
    r.set('user', getUser());

    In your template, you'll be able to inspect the promise's result (on success) or error message (on reject). You'll also be able to figure out the status of the promise.

    <div>
      {{#user}}
        {{#pending}}
          Loading...
        {{/pending}}
     
        {{#result}}
          Hello, {{first}} {{last}}!
        {{/result}}
     
        {{#error}}
          An error occured: {{.}}
        {{/error}}
      {{/user}}
    </div>

    API

    This adaptor sets the following keys:

    • pending
      will be true if the promise is still being processed. It will be undefined as soon as the promise resolves/rejects.

    • result
      will be the result of a resolved (successful) promise. It will be undefined when pending or in the case of an error.

    • resolved
      will be true when the progress resolves and a result is available. This allows you to inspect the status of a promise without consuming its result value.

    • error
      will be the result of a rejected (failing) promise. It will be undefined when pending or if the promise resolves.

    • progress
      if the promise emits a progress update, the progress is reported here. This is only available when a Promise is still pending.

    Differences

    This is an alternate adaptor to Ractive-adaptors-Promise. ractive-promise-alt provides a few more features:

    • Status reporting
    • Progress events
    • Errors are treated differently from results

    Usage

    ractive-promise-alt is available via npm.

    $ npm install --save ractive-promise-alt
    

    npm version

    CommonJS usage: Require the module to use it. It automatically registers itself into either window.Ractive or require('ractive'), whichever's available. No need to use the return value.

    require('ractive-promise-alt');

    Standalone usage: For those not using npm, it's also available as a standalone .js file. Be sure to include it after ractive.js.

    Credits

    Based off lluchs/Ractive-adaptors-Promise.

    Thanks

    ractive-promise-alt © 2014+, Rico Sta. Cruz. Released under the MIT License.
    Authored and maintained by Rico Sta. Cruz with help from contributors (list).

    ricostacruz.com  ·  GitHub @rstacruz  ·  Twitter @rstacruz

    Keywords

    none

    Install

    npm i ractive-promise-alt

    DownloadsWeekly Downloads

    2

    Version

    0.5.3

    License

    MIT

    Last publish

    Collaborators

    • avatar