Angular 2 socially tutorial: User Login displays duplicates (SOLVED)

angular
1

Hi Guys,

I am new to the forum so forgive me if I am in the wrong section.
I am following socially tutorial and I am stuck on Step 08: User Accounts.

I am able to get the login URL and create the accounts and also do a login and logout. However the Login URL shows up twice and it seems like everything is doubled in the GUI. I have two input fields for login and two for passwords and 4 login buttons.

I am not sure how to tackle this. Please see the attached screenshot.

Thanks

264×755 13.8 KB

2

Can you show your code? Which router are you using?

3

This is my parties-list.ts:

import { Component } from ‘@angular/core’;
import { Parties } from ‘…/…/…/collections/parties’;
import { PartiesForm } from ‘…/parties-form/parties-form’;
import { Mongo } from ‘meteor/mongo’;
import { RouterLink } from ‘@angular/router-deprecated’;
import { LoginButtons } from ‘angular2-meteor-accounts-ui’;

@Component({
selector: ‘parties-list’,
templateUrl: ‘/client/imports/parties-list/parties-list.html’,
directives: [PartiesForm, RouterLink, LoginButtons]
})
export class PartiesList {
parties: Mongo.Cursor;

constructor() {
this.parties = Parties.find();
}

removeParty(party) {
Parties.remove(party._id);
}
}

This is parties-list.html:

<div>
  <parties-form></parties-form>
  <login-buttons></login-buttons>
  <ul>
    <li *ngFor="let party of parties">
      <a [routerLink]="['/PartyDetails', {partyId: party._id}]">{{party.name}}</a>
      <p>{{party.description}}</p>
      <p>{{party.location}}</p>
      <button (click)="removeParty(party)">X</button>
    </li>
  </ul>
</div>

Let me know if you need to see any additional code.

4

Hmm your code looks similar to mine when I did the Tutorial. I Uploaded my Step 8: https://github.com/ijager/Socially-Step8

Just a guess, are you using Atom? And is Atom outputting *.js files in your working directory. Maybe your modules are loaded twice that way.

5

I am using atom. And it is outputting .js files. I have been wondering how to make it stop doing that.

I will try out your code without opening it in atom.

6

Hi Guys!..

So I finally managed to figure this out. It was definitely Atom causing the duplication.
I re-ran the tutorial from the beginning without using ATOM, (just plain old vi) and all works well and the login buttons are not in multiples of two(s) anymore. .

Thanks a bunch @ijager for pointing this out.
Just leaving this here in case someone new to this like me lands in the same situation.

Thanks once again guys.

2 Likes