Well, let's say that I have a component that is attached to the root element (<html>) and a child component for each layout. By definition, the root *component* would replace all the child elements of the root element (<head> and <body> in <html>) with the DOM created from the template of the component. I guess that this by itself may lead to some unexpected side effects. That's why I said that to mitigate it I would probably have to "copy the whole <head> into each template of every such component". Assuming the hierarchy, I'd have to copy it just to the template of the *root* element but still, I would have to maintain two copies of the document header (in the template and in index.html [1]). I really doubt that this is a recommended way to do what I need.
Yes, I currently use the "imperative" way (add classes OnInit and remove the classes OnDestroy) but I again doubt that this is a recommended way to do what I need. Or did I missed something? -- Radek On 2016-02-26 13:32, Günter Zöchbauer wrote: > I don't know if that works with `<html>`. I have tried it successfully with > `<body>`. > Therefore I guess it would work for `<html>` as well. > > Not sure what you mean by: > > and copy the whole <head> into each template of every such component? > > One root component should be enough. The layouts can be components in the > root component. > Adding the root component to `<head>` would probably wipe all it's static > content when the root component is bootstrapped. > > Another way is to add the root component to `<body>` or as a child of body > and read/write the classes of `<html>` imperatively (instead of declarative > binding syntax) > > On Thursday, February 25, 2016 at 11:24:37 AM UTC+1, Radek Holý wrote: > >> Hello, >> >> I'm using a CSS framework which requires different classes of the <html> >> element for different layouts. I'd like to have a component for each >> layout. >> >> How can I bind to the <html>'s attributes/classes from these components? >> >> Do I have to use the "html" selector and copy the whole <head> into each >> template of every such component? Well, I can create a component which >> holds the header but still it would have to be maintained in at least >> two different files (the index.html and the template). >> >> Or should I create a directive with the selector "html" and access this >> directive from these components? >> >> What is the recommended approach? >> >> Thanks in advance >> -- >> Radek -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
