programmatically accessing compiled CSS class names in angular 2

Question

In d3, I make a lot of elements like this:

this.title = svg.append('text')
    .attr('class', 'graph-title')
    .text('blah blah blah');

I was hoping I could put that class in the CSS local to the component creating this svg, but you can't refer to the local css this way. What I did above would only work if I put the relevant style into the global CSS, which for reusability reasons is not what I'd like to do.

Is there some way I can programmatically add the local css class to this dynamically-created element?

It's not clear what you're asking. What is the local component? What do you want to achieve by mixing this classes? Maybe there is a workaround for your problem. — Mehraban
– Mehraban, Commented Sep 5, 2016 at 4:05

Günter Zöchbauer · Accepted Answer · 2016-09-05 04:25:56Z

1

You can use >>> (or /deep/) to address dynamically added elements that don't get the encspsulation attributes (_ng_content...) added from styles added to components:

:host >>> graph-title {
  ...
}

answered Sep 5, 2016 at 4:25

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

programmatically accessing compiled CSS class names in angular 2

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related