Display models of text-angulars

Question

I'm displaying two text-angular WYSIWYG fields in ng-repeat like so

<div data-ng-repeat="n in langInput.values" class="sell__description-container">
    <h2 class="sell__heading-secondary">
        Opis w języku: {{ n.selected }}
    </h2>
    <div text-angular="text-angular"
         name="htmlcontent_{{n.id}}_{{ n.selected }}"
         data-ng-model="descriptionHtml[$index]"
         class="sell__text-editor"
         required>
    </div>
    {{ descriptionHtml[$index] }}

And just below field I'm showing its model and it's working correctly. It shows text with all this tags which I chose in editor.

But 200 lines below I have something like summary and I want to display this model one more time in other ng-repeat loop:

<tr data-ng-repeat="n in langInput.values">
    <td>Opis ({{ n.selected }})</td>
    <td>
        {{ descriptionHtml[$index] }}
        <br>
        {{ $index }}
    </td>
</tr>

And here it is not showing description value. Althought $index is indeed 0 and 1 like above.. Why is that? How to fix?

At the moment I just want to make it work. Later on I'll not display it as a string in td but I'll pass this model as a string to function which will open bootstrap modal window in which I'll bind this string as html with ng-bind-html so it will be something like preview.

Could you please add a plunkr if possible for better understanding / to easily replicate the issue? — AD8, Jun 18 '18 at 02:50
Is it necessary? I'll be a lot of work to reproduce on plunker — BT101, Jun 18 '18 at 02:50
It is not mandatory, if it is a lot of work to do so. Else it helps replicate and identify the issue quickly. And sometimes it may be some of those 200 lines that are causing the issue (not always, sometimes). I will try to replicate this on a small plunkr and will get back. — AD8, Jun 18 '18 at 02:52
It's the job we do really, if you have a problem you can't figure out, try to reproduce it isolated from everything else. While doing that you'll very likely find the problem before even posting to stack-overflow. — ippi, Jun 18 '18 at 02:53
Alright wait I'll try to do so and I'll edit post in sometime. Just need to finish one other task — BT101, Jun 18 '18 at 02:54
I'll just add in that basing anything on $index just breaks as soon as items re-arrange or you add/remove something. if it were me I'd attach descriptionHtml to each element so you can `{{ n.descriptionHtml }}` and `data-ng-model="n.descriptionHtml"`. Preferable as early as you can - server-side if possible - but redecorating data when it arrives is workable as well. Have you made sure those repeats are in the same controller (or app even)? — ippi, Jun 18 '18 at 02:59

BT101 · Accepted Answer · 2018-06-18T03:07:48.363

I found problem. I copied code from textangular docs and it has its own controller so my controller structure was like

<div ng-controller="external">
    <div ng-controller="textEditor">
        here i have ng-repeat and here i'm also displaying content of editor
    </div>
    here i tried to ng-repeat over it again
</div>

So in textEditor ctrl it was in right scope and it display correctly. I need to pass this value from child scope(textEditor) to parent scope(external).

Declaring $scope.descriptionHtml in parent controller solve the issue since child controller inherit scope and when I modify it in child then also parent is refreshed.

Display models of text-angulars

1 Answers1