This is the current situation as of beta.0

@Component({
  selector: 'cmp-a'
  template: `<ng-content select="span"></ng-content>`
})
class AComp {}

<cmp-a>
  <span></span>
  <span *ngIf="exp"></span>
<cmp-a>

<span *ngIf> is a template and is not projected inside <ng-content select="span">.
Only the first <span> gets projected.

Proposal:

Change <ng-content> behavior so that templates gets projected when all their child nodes match the selector:

  <span *ngIf="exp"></span>

  <!-- or -->

  <template>
    <span></span>
  </template>

The template would be projected into <ng-content select="span"> because the only child node matches the selector. (Text nodes composed of white spaces only are ignored for the purpose of matching the children)

Template matching algorithm details:

Multiple children:

  <template>
    <el1></el1>
    <el2></el2>
  </template>

<ng-content select="el1"> would generate an error because some of the template children are selected but not all.

To project the template, all child nodes have to be selected. <ng-content select="el1, el2"> would project the template.

Nested templates:

  <template>
    <el1></el1>
    <template>
      <el2></el2>
    </template>
  </template>

<ng-content select="el1, el2"> is required to project the template (ie we descend into nested templates)

refs:

• static content projection design doc as currently implemented,