DokuWiki

This is an old revision of the document!

---

// inline template
@Component ({
  selector: 'media-tracker-app',
  template: '<h1>My app</h1>',
})
// ou
  template: `
              <h1>My App</h1>
              <p>now width multiline HTML</p>
            `,

Ou mettre dans du html séparé :

@Component ({
  selector: 'media-tracker-app',
  template: 'app/app.component.html',
})

// app/app.component.html
<h1>My App</h1>

Ajout de CSS

@Component ({
  selector: 'media-tracker-app',
  template: 'app/app.component.html',
  styles:  [`
              h1 {
                color: blue;
              }
            `,[`
              p {
                color: black;
              }
            `],
})

Pour le mettre ailleurs :

@Component ({
  selector: 'media-tracker-app',
  template: 'app/app.component.html',
  styles: ['app/app.component.css'],
})

note: angular se charge de modifier les sélecteurs CSS pour cibler les éléments de l'application.