🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
DemoInstallSign in
Socket
DemoInstallSign in

breeze-bridge-angular2

Package Overview
Dependencies
Maintainers
1
Versions
9
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

breeze-bridge-angular2

A bridge that configures Breeze and Angular2 to work together.

0.3.6
latest
npm
Version published
Weekly downloads
1
Maintainers
1
Weekly downloads
 
Created
Source

Welcome to the Breeze-Angular2 bridge

A bridge that configures Breeze to work with Angular 2 out of the box.

Change Log

0.3.5 December 1, 2016

Features

  • Export AjaxAngular2Adapter class, making it easier to add auth headers.

0.3.4 October 20, 2016

Fixed Bugs

  • Fix error response payload not being passed up

0.3.3 September 28, 2016

Fixed Bugs

  • Removed post install scripts from package.json

0.3.2 September 23, 2016

Features

  • Update to Angular 2 final
  • Add support for AoT compilation

0.3.1 August 25, 2016

Fixed Bugs

  • Fix errant rejected promise in failure case

0.3.0 August 24, 2016

Breaking Changes

  • The Breeze Angular2 bridge is no longer an injectable service. It has been changed to an NgModule

Prerequisites

  • Breeze client npm package 1.5.12 or higher
  • Angular 2.0.0 or higher

Installation

  • Install breeze-client

    npm install breeze-client --save

  • Install breeze-bridge-angular2

    npm install breeze-bridge-angular2 --save

Usage

A comprehensive example app that makes use of the bridge can be found here: https://github.com/Breeze/temphire.angular2.

To use the bridge in your own application, the following steps are required.

Configure breeze-client and breeze-bridge-angular2 in systemjs.config.js.

  // map tells the System loader where to look for things
  var map = {
    ...
    'breeze-client':              'node_modules/breeze-client',
    'breeze-bridge-angular2':     'node_modules/breeze-bridge-angular2'
  };

  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    ...
    'breeze-client':              { main: 'breeze.debug.js', defaultExtension: 'js'},
    'breeze-bridge-angular2':     { main: 'index.js', defaultExtension: 'js'}
  };

Import BreezeBridgeAngular2Module and add it to the app module's imports.

import { BreezeBridgeAngular2Module } from 'breeze-bridge-angular2';

@NgModule({
    imports: [
        BreezeBridgeAngular2Module
    ],
    bootstrap: [ AppComponent ]
})
export class AppModule { }

Now we can use Breeze normally from something like a data service for example.

import { Injectable } from '@angular/core';
import { EntityManager, EntityQuery } from 'breeze-client';
import { Customer } from './entities';

@Injectable()
export class DataService {

  private _em: EntityManager;

  constructor() {
    this._em = new EntityManager();
  }

  getAllCustomers(): Promise<Customer[]> {
    let query = EntityQuery.from('Customers').orderBy('companyName');

    return <Promise<Customer[]>><any> this._em.executeQuery(query)
    .then(res => res.results)
    .catch((error) => {
      console.log(error);
      return Promise.reject(error);
    });
  }
}

Notice that we are also importing breeze-client instead of loading it as a static script as you might have seen in other examples. Make sure you don't have an extra script tag in your index.html that attempts to statically load breeze.debug.js or similar.

Example index.html:

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles.css">

    <!-- Polyfill(s) for older browsers -->
    <script src="node_modules/core-js/client/shim.min.js"></script>

    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>

    <script src="systemjs.config.js"></script>
    <script>
      System.import('app').catch(function(err){ console.error(err); });
    </script>
  </head>

  <body>
    <my-app>Loading...</my-app>
  </body>
</html>

Keywords

breeze
angular2
bridge

FAQs

Package last updated on 01 Dec 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

The Growing Risk of Malicious Browser Extensions

Research

Security News

The Growing Risk of Malicious Browser Extensions

Socket researchers uncover how browser extensions in trusted stores are used to hijack sessions, redirect traffic, and manipulate user behavior.

By Kush Pandya  -  Jun 13, 2025