Angular's ng-show in meteor

help
1

Hi, before trying meteor I’ve dabbled in angular and there i found a cool little feature that i’d like to use in meteor but i dont want to install the whole angular code to just use this small part. So if there is some easy way to set up this with meteor/blaze let me know.

Im working on my login and register forms and this is what i would have done in angular:

<div class="login" ng-show="true">
	
  //login form


Not registered?	<button ng-click="true = !true">Register</button>
</div>

<<div class="login" ng-show="!true">
	
	//register form

 
</div>
1 Like
2

Are you asking to toggle between two divs, one to show a login form and one to show a registration form?

3

If so, you could do something like this:

<template name="loginregister">
... form here ...

Not registered? <button id="register">Register now</button>

{{#if not_registered}}
 ... form here...
{{/if}}
</template>


/* helper */
Template.loginregister.helpers({
   not_registered: function() {
      return Session.get('not_registered');
   }
});

/* event */
Template.loginregister.events({
   'click #register': function() {
      Session.set('not_registered', true);
   }
});
1 Like
4

Thanks for the input, I’ve used some jQuery in the end

"click #notRegistered": function () {
		$( "#register-form" ).removeClass( "invisible" );
		$( "#login-form" ).addClass( "invisible" );

	},

I was just curios if there was a way to set it up without writing some JS (events, jQuery, etc.) like i could in angular

5

Instead of adding in a class called invisible, why don’t you just use the jQuery hide() and show()?

So, you could have it like this:

"click #notRegistered": function () {
  $( "#register-form" ).hide();
  $( "#login-form" ).show();
}
6

Because I’ve read somewhere on stack that adding a css class is the right way to do it and I didn’t know there was a hide() option :grimacing:

PS:
I’ve been learning programming just for the last 3 months so I’ve got alot of basics and “most used” to learn so please bear with my sometimes stupid questions and thanks guys for the help so far…

7

or you could use angular-meteor and get all your favorite angular features.