Nobody Prefers Margarine

    ng2-cloudinary
    TypeScript icon, indicating that this package has built-in type declarations

    0.9.2 • Public • Published

    ng2-cloudinary

    Build Status npm version devDependency Status GitHub issues GitHub stars GitHub license

    Demo

    https://ekito.github.io/ng2-cloudinary/demo/

    Table of contents

    About

    Angular2 components for Cloudinary image back-end

    Installation

    Install through npm:

    npm install --save ng2-cloudinary
    

    Usage

    You may also find it useful to view the demo source.

    Module imports

    //demo.module.ts
    import { NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
     
    import { Ng2CloudinaryModule } from './../ng2-cloudinary';
    import { FileUploadModule } from 'ng2-file-upload';
    import { Demo } from './demo.component';
     
    @NgModule({
        declarations: [Demo],
        imports: [
            BrowserModule,
            Ng2CloudinaryModule,
            FileUploadModule
        ],
        bootstrap: [Demo]
    })
    export class DemoModule {}

    cl-image or CloudinaryImageComponent

    This directive allows displaying Cloudinary image and apply transformations

    //demo.component.ts
    import {Component} from '@angular/core';
    import {CloudinaryImageComponent} from 'ng2-cloudinary';
     
    @Component({
      selector: 'demo-app',
      template: '<cl-image public-id="image_id" cloud-name="myCloudName"></cl-image>'
    })
    export class Demo {
    }

    CloudinaryUploader

    This service allows uploading files to cloudinary using ng2-file-upload dependency.

    //demo.component.ts
    import { Component } from '@angular/core';
    import { CloudinaryOptions, CloudinaryUploader } from 'ng2-cloudinary';
     
    @Component({
      selector: 'demo-app',
      template: '<input type="file" ng2FileSelect [uploader]="uploader"/>',
    })
    export class Demo {
     
      cloudinaryImage: any;
     
      uploader: CloudinaryUploader = new CloudinaryUploader(
        new CloudinaryOptions({ cloudName: 'myCloudName', uploadPreset: 'myUnsignedPreset' })
      );
     
      constructor(){
        //Override onSuccessItem function to record cloudinary response data
        this.uploader.onSuccessItem = (item: any, response: string, status: number, headers: any) => {
          //response is the cloudinary response
          //see http://cloudinary.com/documentation/upload_images#upload_response
          this.cloudinaryImage = JSON.parse(response);
          
          return {item, response, status, headers};
        };
      }

    Documentation

    All documentation is auto-generated from the source via typedoc and can be viewed here: https://ekito.github.io/ng2-cloudinary/docs/

    Development

    Prepare your environment

    • Install Node.js and NPM (should come with)
    • Install local dev dependencies: npm install while current directory is this repo

    Development server

    Run npm start to start a development server on port 8000 with auto reload + tests.

    Testing

    Run npm test to run tests once or npm run test:watch to continually run tests.

    Release

    • Bump the version in package.json (once the module hits 1.0 this will become automatic)
    npm run release

    License

    MIT

    Install

    npm i ng2-cloudinary

    DownloadsWeekly Downloads

    44

    Version

    0.9.2

    License

    MIT

    Last publish

    Collaborators

    • jboulay