Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Q: Is Iron Router able to render components via yield? #44

Open
rclai opened this issue May 1, 2015 · 33 comments
Open

Q: Is Iron Router able to render components via yield? #44

rclai opened this issue May 1, 2015 · 33 comments
Labels

Comments

@rclai
Copy link

rclai commented May 1, 2015

Router.route('/', {
  name: 'MyRoute',
  template: 'MyComponent'
});
@rclai rclai changed the title Q: Is Iron Router able to render components? Q: Is Iron Router able to render components via yield? May 1, 2015
@mitar mitar added the question label May 1, 2015
@mitar
Copy link
Member

mitar commented May 1, 2015

Hm, no. :-( This would just render the logic-less template content. Not a component. You could probably do template: MyComponent.renderComponent() there.

@mitar
Copy link
Member

mitar commented May 1, 2015

It seems it should work easily. You just have to use a controller with a different lookupTemplate method. This overrides it. But you could easily create a controller class which just inherits from RouteController.

var originalLookupTemplate = RouteController.prototype.lookupTemplate;
RouteController.prototype.lookupTemplate = function () {
  if (var component = BlazeComponent.getComponent(this.lookupOption('template'))) {
    return component.renderComponent();
  }
  return originalLookupTemplate.apply(this);
};

@mitar
Copy link
Member

mitar commented May 1, 2015

Now that I am thinking, probably it could be possible to create a JavaScript class which is both an RouteController and a Blaze Component. That would be an interesting combination.

@rclai
Copy link
Author

rclai commented May 3, 2015

Oh wow, thanks for looking that up so fast. I think I will just use that prototype patch for now but were you thinking of doing something in particular with Iron Router or can I just close this?

@mitar
Copy link
Member

mitar commented May 3, 2015

We could probably made that into a package. Or push them upstream with a weak dependency in iron-router.

@mitar
Copy link
Member

mitar commented May 6, 2015

Does it work or does it not work?

@rclai
Copy link
Author

rclai commented May 7, 2015

It does, sorry I messed up.

@rclai
Copy link
Author

rclai commented May 7, 2015

So what did you want to do about this? Did you want to create a package for making BC compatible with IR?

@mitar
Copy link
Member

mitar commented May 10, 2015

Patch into Meteor changing all necessary bits to have officially all extension points needed by Blaze Components was just merged into its development branch: meteor/meteor@eff8016

Based on that I made this pull request to Iron Router: iron-meteor/iron-dynamic-template#11

If it is merged in Blaze Components should work out of the box with iron router.

@mitar
Copy link
Member

mitar commented May 10, 2015

@rclai: Could you test if using that branch of Iron Router works for you? (You do not have to upgrade to latest Meteor, because at the moment Blaze Components monkey-patch it with what was currently merged in.)

@mitar
Copy link
Member

mitar commented May 11, 2015

Try with 0.9.1 version.

@rclai
Copy link
Author

rclai commented May 11, 2015

Are you talking about this branch?

@mitar
Copy link
Member

mitar commented May 11, 2015

Yes.

@rclai
Copy link
Author

rclai commented May 11, 2015

For some reason I got this error:

Conflict: Constraint iron:[email protected] is not satisfied by iron:layout 1.0.0-pre3.
Constraints on package "iron:layout":
* iron:layout@=1.0.0-pre3 <- top level
* iron:[email protected] <- iron:router 1.0.7 <- profab:core 0.1.0
* iron:[email protected] <- iron:controller 1.0.7 <- iron:router 1.0.7

@mitar
Copy link
Member

mitar commented May 11, 2015

Why you have a top level constraint on 1.0.0-pre3?

@rclai
Copy link
Author

rclai commented May 11, 2015

Oh whoops I forgot to git checkout patch-template.

@rclai
Copy link
Author

rclai commented May 11, 2015

Okay, my routes error out with this now:

TypeError: undefined is not a function
    at [object Object].Controller (packages/iron:controller/lib/controller.js:23:1)
    at new Controller.extend.constructor (packages/iron:router/lib/route_controller.js:14:1)
    at [object Object].ctor (packages/iron:core/lib/iron_core.js:88:1)
    at Function.Router.createController (packages/iron:router/lib/router.js:201:1)
    at Function.Router.dispatch (packages/iron:router/lib/router_server.js:39:1)
    at Object.router (packages/iron:router/lib/router.js:15:1)
    at next (/root/.meteor/packages/webapp/.1.2.0.xaqlky++os+web.browser+web.cordova/npm/node_modules/connect/lib/proto.js:190:15)
    at Object.Package [as handle] (packages/cfs:http-methods/http.methods.server.api.js:425:1)
    at next (/root/.meteor/packages/webapp/.1.2.0.xaqlky++os+web.browser+web.cordova/npm/node_modules/connect/lib/proto.js:190:15)
    at Function.app.handle (/root/.meteor/packages/webapp/.1.2.0.xaqlky++os+web.browser+web.cordova/npm/node_modules/connect/lib/proto.js:198:3)

@mitar
Copy link
Member

mitar commented May 11, 2015

You will have to give more information. :-) Like, what exactly does not work.

@mitar
Copy link
Member

mitar commented May 11, 2015

BTW, you do not need the patch above anymore.

@rclai
Copy link
Author

rclai commented May 11, 2015

Huh? So am I supposed to just upgrade to 0.9.2 and that's it?

@mitar
Copy link
Member

mitar commented May 11, 2015

Yes. Just upgrade to 0.9.2 and use the patch-template branch of dynamic-template.

@rclai
Copy link
Author

rclai commented May 11, 2015

Oh, well it's not working, for some reason it (iron layout branch) breaks iron:controller and I can't visit any route. It shows the error in the client-side.

@mitar
Copy link
Member

mitar commented May 11, 2015

Hm. Can you make a small example where it breaks?

@rclai
Copy link
Author

rclai commented May 11, 2015

I'll try that later, but the error happens here.

@mitar
Copy link
Member

mitar commented May 11, 2015

This is really strange. I think there is maybe some mismatch of versions you have? Do you have everything on your latest version? What does .meteor/versions say?

@rclai
Copy link
Author

rclai commented May 12, 2015

@rclai
Copy link
Author

rclai commented May 12, 2015

I found a way to render a Blaze Component without having to use the lookupTemplate monkey-patch. You would have to use the action function unfortunately.

Router.route('/my-route', {
  'name': 'routeName',
  action: function () {
    // My solution to make sure the component doesn't get re-rendered in case I had 
    // multiple routes using the same template. In most cases you won't need this check.
    if (!BlazeComponent.getComponentForElement($('#MyComponentId').get(0))) {
      this.render(BlazeComponent.getComponent('MyComponentRegisteredName').renderComponent());
    }
  }
});

@MatejJan
Copy link
Member

The easiest solution I found is to simply wrap the component into a normal template.

<template name="myComponent">
  {{> MyComponent}}
</template>

<template name="MyComponent">
  …
</template>

You would then point the router to render myComponent template.

@mitar
Copy link
Member

mitar commented Oct 21, 2015

I suggest you use Flow Router. That one is the one I am using in my projects. See example app here.

I have some code made which would make Iron Router easier to use (route would be the same as component), but I have not yet fixed all the quirks.

@mitar
Copy link
Member

mitar commented Oct 21, 2015

See #79.

@MatejJan
Copy link
Member

I suggest you use Flow Router. That one is the one I am using in my projects. See example app here.

Will check it out, was not aware of it yet.

(What is Meteor's recommendation for routing these days anyway?)

@mitar
Copy link
Member

mitar commented Oct 21, 2015

Iron Router or Flow Router, but guide now mentions only Flow Router.

@rclai
Copy link
Author

rclai commented Oct 21, 2015

I did use the template proxy method at some point. But I'm more inclined to using blaze layout to render these components now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants