Skip to content
This repository has been archived by the owner on Dec 4, 2017. It is now read-only.

docs(cookbook - item template) Cookbook for a component item template. #1862

Open
wants to merge 4 commits into
base: master
Choose a base branch
from

Conversation

bennadel
Copy link
Contributor

@bennadel bennadel commented Jul 10, 2016

This cookbook demonstrates how to provide a component with an external
TemplateRef that the component can then use to render aspects of its own
internal template. An example of this, as explored in the cookbook, is
providing a select-menu component with an item template that the component
can use to render the options in its dropdown.

@bennadel bennadel changed the title Cookbook for a component item template. docs(cookbook - item template) Cookbook for a component item template. Jul 10, 2016
@@ -0,0 +1,12 @@
/* tslint:disable */
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't actually know what that line does. I saw that you added it to one of my other cookbooks:

https://github.com/IdeaBlade/angular.io/blame/master/public/docs/_examples/cb-set-document-title/ts/app/main.ts#L1

... so I just copied it over here as well. Should I remove?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't remember why I did it. I will come back to this.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Foxandxss it looks like if I remove it I get:

[08:46:47] [gulp-tslint] error cb-item-template/ts/app/main.ts[6, 9]: function invocation disallowed: console.info
[08:46:57] 'lint' errored after 18 s
[08:46:57] Error in plugin 'gulp-tslint'

@Foxandxss
Copy link
Member

In a general note. We are using double quotes " for the HTML and you are using single quotes ' here in your example. Why?

Is better to maintain consistency.


it('should toggle the menu', function () {

expect( element( by.className( 'select-items' ) ).isPresent() ).toBe( false );
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All the spaces between parens parameters are nice, but that is not the convention we use in this project so I would ask you for remove them in all the files.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No problem, I can do that. I didn't realize that was part of the style.

@bennadel
Copy link
Contributor Author

@Foxandxss when you say "double quotes in the HTML", what file are you referring to? I'm trying to use single-quotes all over the place, as that's what Ward asked me to do. If there are double-quotes somewhere, it's just an oversight on my part. But, I don't see what you are referring to.

@Foxandxss
Copy link
Member

On the templates.

<div foo='10'>

vs

<div foo="10">

@bennadel bennadel force-pushed the ben-cb-item-template branch from 63dc3d7 to 0579d6d Compare July 11, 2016 12:54
@bennadel
Copy link
Contributor Author

@Foxandxss ok, I think I addressed all of your concerns.

<simple-select
[items]="colors"
[(value)]="selectedColor"
[template]="externalTemplate">

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe it would make sense to name it templateRef or itemTemplateRef?

@pkozlowski-opensource
Copy link
Member

I had a look at this PR since was curious how the template outlet thingy is going to be described. I like the example a lot! Good stuff!

This cookbook demonstrates how to provide a component with an external
`TempalteRef` that the component can then use to render aspects of its own
internal template. An example of this, as explored in the cookbook, is
providing a select-menu component with an item template that the component
can use to render the options in its dropdown.
@Foxandxss Foxandxss force-pushed the ben-cb-item-template branch from 7d19a90 to afbe26f Compare August 28, 2016 19:44
@googlebot
Copy link

We found a Contributor License Agreement for you (the sender of this pull request) and all commit authors, but as best as we can tell these commits were authored by someone else. If that's the case, please add them to this pull request and have them confirm that they're okay with these commits being contributed to Google. If we're mistaken and you did author these commits, just reply here to confirm.

1 similar comment
@googlebot
Copy link

We found a Contributor License Agreement for you (the sender of this pull request) and all commit authors, but as best as we can tell these commits were authored by someone else. If that's the case, please add them to this pull request and have them confirm that they're okay with these commits being contributed to Google. If we're mistaken and you did author these commits, just reply here to confirm.

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

Successfully merging this pull request may close these issues.

4 participants