Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • Dec 05 21:45
    saiMedavarapu commented #1997
  • Nov 07 08:26
    testacp commented #1853
  • Nov 07 08:26
    testacp commented #1853
  • Oct 30 15:24
    emanuelcoelho1986 closed #2011
  • Oct 30 10:43
    sameerpallav commented #2025
  • Oct 15 15:20
    alanhg commented #1997
  • Sep 30 15:12
    bbrink68 commented #2049
  • Aug 23 13:34
    SouravKumar89 edited #2058
  • Aug 23 13:27
    SouravKumar89 opened #2058
  • Aug 22 00:04

    PatrickJS on master

    Update README.md (compare)

  • Aug 13 17:17
    ramsunvtech commented #1925
  • Aug 12 22:58
    terrancecorley commented #770
  • Aug 09 02:30
    jindovu commented #2049
  • Aug 09 02:22
    jindovu opened #2057
  • Aug 08 10:49
    krawinkelm commented #2053
  • Jul 21 14:14
    FilipLitwora commented #958
  • Jul 21 14:14
    FilipLitwora commented #958
  • Jul 21 14:14
    FilipLitwora commented #958
  • Jul 09 11:40
    Sanafan commented #1713
  • Jul 05 11:41
    hoang-innomizetech commented #2053
@marinho thanks for your help, can you point to any example with similar config?
Marinho Brandão

@johnespn there is a couple of examples over the web, this is one — https://github.com/jkuri/ng2-datepicker

other — https://github.com/ocombe/ng2-translate
other much bigger one — https://github.com/angular/material2

Bear in mind that there’s nothing special about building a library of reusable components. It will be very similar to a standard Angular2 app. You just have to configure the NgModule to export all components, pipes, directives and services you want to reuse and ensure its package.json is as clean as possible to let the other project use it.

It probably won’t need either routes and entry components, as it will always be just used by another app.

have fun!


I am attempting to write unit tests using a templateUrl but am getting this error message

Failed: Uncaught (in promise): Failed to load forgot-password.template.html
    Error: Uncaught (in promise): Failed to load forgot-password.template.html

for my HTML template

Here is the component file
import {Component, ViewContainerRef} from '@angular/core';
import {MdDialog, MdDialogConfig, MdDialogRef} from '@angular/material';

    selector: 'forgot-password',
    styleUrls: ['./forgot-password.style.scss'.toString()],
    templateUrl: './forgot-password.template.html'

export class ForgotPasswordDialog {
    public emailAddress;

    constructor(public dialogRef: MdDialogRef<ForgotPasswordDialog>) {


    ngOnInit() {
        this.emailAddress = '';

    cancel() {

    submit(model: string, isValid: boolean) {
        if (isValid) {
and the spec
import { async, TestBed } from '@angular/core/testing';
import { Component, ViewContainerRef } from '@angular/core';
import { MaterialModule } from '@angular/material';
import { ForgotPasswordDialog } from './forgot-password.component';

describe('ForgotPasswordDialog', () => {
   let forgotPassword: ForgotPasswordDialog;

    beforeEach(async(() => {
            declarations: [ForgotPasswordDialog],
            imports: [MaterialModule]

    beforeEach(() => {
        let fixture = TestBed.createComponent(ForgotPasswordDialog);
        forgotPassword = fixture.componentInstance;

    it('module should be defined', () => {
Does anyone have any idea on how to correct those errors?
@marinho will take a look and try that out, you save my day! Thanks a lot!!!
Hi, What is the base place to put Third Party JS and CSS file what is not in NPM ?
Vendor is suggesting to include
// Add mandatory wijmo.css
// Wijmo core files are not modules, so add them using the script-loader
How to ensure they would end up in vendor.*.bundle.js
and also where should I put typings to those third party libraries?
And how to register them correctly?
Tim Sandberg
How does the app get a reference to Promise here:
export function main(): Promise<any> {
    return platformBrowserDynamic()
    .catch(err => console.error(err));
Karthi Keyan
im new here..
what is system.js ??
Don Franco
How do you extract styling into its own bundle inside <head>?
Don Franco
Solved it with ExtractTextPlugin
does anyone have guideline about using redux with Angular2-webpack-starter?
Impementing bs by this example and got 404 on all font requets
help pliz?!
Tanner Stirrat
@yogesh7607 why do you want to use redux? angular2 has its own state management built in...
@mskarthi95 as far as I can tell, it's a way of handling imports, especially asynchronously
anyone have experience with test running problems? I switched my tsconfig use module: es2015 to take advantage of tree-shaking awesomeness, and it works fine for my dev server and builds, but it's broken my tests. it seems like there's something with Istanbul and Esprima not knowing what to do with typescript?
invisible me :(
Tanner Stirrat
@trsh you haven't given us a whole lot of information to go off of
what's 404ing? where are you seeing this?
also, if anyone is interested, my problem was resolved by adding query { esModules: true } to the istanbul-instrumenter-loader section of webpack.test.conf
Mohit Gupta
Hey All. Could someone suggest a way to test the caching implementation for Angular2 webapp from QA standpoint
Tanner Stirrat
how do you install custom types in the starter kit that aren't provided on npm?
Marinho Brandão
@yogesh7607 I have used Redux in my app which was based on angular2-webpack-starter… I just don’t have a guideline, but can answer questions if you have. Did you try it already? Did it fail?
@tstirrat15 I’m not aware about Angular2’s own built-in state management… how is that?
the 3 popular ways of state management I know in ng2 are: ng2-redux, ngrx and pure RxJS. ng2-edux and ngrx are Redux, the only difference is that ng2-redux uses Redux.js while ngrx uses RxJS observables. Pure RxJS would be the manual and harder way, but would work too. In my team we opted for ng2-redux.
@tstirrat15 the 404 error is for font request. For example. http://localhost:3000/node_modules/bootstrap/fonts/glyphicons-halflings-regular.woff2
Seems logical, that assets would not load from node_modules dir. But than those instructions are incomplete?
Anybody? Im stuck for 2 days now
@trsh can it be that limit=10000 doesnt match the size of your woff-file?
@tstirrat15 , Thanks for the comment. I guess you meant to say "since Angular 2 already ships with RxJS, we did not have to bring in any new libraries" ... i found this in this article on googling after reading your comment, thanks. https://vsavkin.com/managing-state-in-angular-2-applications-caf78d123d02#.2icde4dka
@danielsun174 mhm..
@marinho, did you have any specific reason about using Redux over builtin RxJS?
@danielsun174 nop. not the problem :(
Tanner Stirrat
@yogesh7607 yeah, it seems that the typical way that you handle state in Angular2 is to put it into services, and then use observables to push data around
@trsh do you know for sure that that file is available at that location?
it sounds weird to me that it's trying to serve directly out of node_modules
Marinho Brandão

@yogesh7607 when we made such decision, we actually had no knowledge enough to stabilish reasoning… we just didn’t know exactly what ngrx did and using RxJS for managing state wasn’t an option in our short knowledge.

but now, a few months later, yeah, I think the manual way of managing state with RxJS would be through services, but it looks to me harder to maintain and potentially hackish, as you have to design that, as services are very flexible and could be used for pretty much anything or any approach.

Redux is opinionated: the state must be global and immutable and any change must always go through the combined reducers, being reachable to any of them, any component can subscribe to any level of the state, etc… I’m aware that can be done with RxJS too, but you basically have to maintain that by your own convention and that sounds pretty fragile to me.

Redux is also veeeeery simple, way simpler than RxJS for beginners or “full stack developers” who do 1 adventure frontend task per week and aren’t very familiar with the code and RxJS’ tricks.

That’s my 2 cents


@tstirrat15 & @marinho, thanks for sharing your views. I am about to start on my first project in angular and I am doing basic study for selection. Your notes are definitely helpful.

One of my team-member came across this video. In this talk, Jay shares the basics of RxJS 5 Observables and how they can be used with React and Redux to manage asynchronous effects using redux-observable. https://www.youtube.com/watch?v=AslncyG8whg. What is your opinion about this approach that has best of both RxJS and Redux. Link to git-hub project: https://github.com/redux-observable/redux-observable

Hello! I would like to update the model of an input from another place but it's not working
it only updates if I modify the model inside the input box
<input *ngIf="currentDateFrom" [(ngModel)]="currentDateFrom" [ngModelOptions]="{standalone: true}" type="text">

<span *ngIf="currentDateFrom">{{ getDate(currentDateFrom) | date:'dd/MM/y'}}</span>

<datepicker [hidden]="hideDateFrom" [(ngModel)]="currentDateFrom" [minDate]="minDate" [showWeeks]="true" style="margin-top: 2px;"></datepicker>

both changes (datepicker and input) enters in getDate() but when you modify model from input it doesn't change in datapicker and vice versa. Is posible to update these values or not? I tried with (update) event of datepicker (I was not able to overwrite it) and with (ngModelChange) of input. But nothing works :(