0

for some reason, I cannot change the text of a span

This is the span in html

<span id="sortingText"></span>

This is the span being called within typescript

  sortingText : any =  document.getElementById("sortingText");

And this is the method where I am changing the value

      this.sortingText.textContent = "Sorting by Descending";

However when I try this, I get "ERROR TypeError: Cannot set property 'textContent' of null" What am I doing wrong?

IamSoBadAtLinkedLists
  • 13
  • 3
  • Maybe the `span` element does not exist yet when you're trying to access it with `document.getElementById`. In which method are you trying to do this? – uminder Jan 26 '20 at 14:49

2 Answers2

1

As you're using Angular, why don't you use interpolation?
Add a property which contains the sort order:

sortingText = 'Sorting by Descending';

In your component's template:

<span>{{ sortingText }}</span>

To display the sort order, you have to put your property between two double braces, this way Angular will insert its value in your span.
You should read how to display data in Angular docs.

JoH
  • 514
  • 1
  • 6
  • 16
0

Your question is tagged with angular so inject elements like this:

How can I select an element in a component template?

Seryoga
  • 793
  • 6
  • 15