ngЕсли не работает заливка значков SVG для угловых 6 - PullRequest
0 голосов
/ 31 августа 2018

Вот мой код для реализации, если условие в теге SVG:

 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                  width="60px" height="65px" viewBox="0 0 60 92" enable-background="new 0 0 60 92" xml:space="preserve">
    <defs>
                   <linearGradient *ngIf="!compareCompanyRevenue" id="progress1019" x1="0" y1="1" x2="0" y2="0">
                      <stop id="stop1005" offset="0" stop-color="#e1edf3" />
                      <stop id="stop2005" offset="0" stop-color="#02ABBA" />
                    </linearGradient>
                    <linearGradient *ngIf="compareCompanyRevenue" id="progress1019" x1="0" y1="1" x2="0" y2="0">
                      <stop id="stop1005" offset="0" stop-color="#02ABBA" />
                      <stop id="stop2005" offset="0" stop-color="#e1edf3" />
                    </linearGradient> 
    </defs>

//up-arrow
    <path *ngIf="!compareCompanyRevenue" fill-rule="evenodd" clip-rule="evenodd" fill="url(#progress1019)" stroke="#02ABBA" stroke-miterlimit="10" d=""/>

//down-arrow
    <path *ngIf="compareCompanyRevenue" fill-rule="evenodd" clip-rule="evenodd" fill="url(#progress1019)" stroke="#02ABBA" stroke-miterlimit="10" d=""/>
    </svg>

test.ts // сейчас я пытаюсь заполнить, используя javascript

document.getElementById("stop1005").setAttribute("offset", "0.25");
document.getElementById("stop2005").setAttribute("offset", "0.25");

необходимость изменения в теге «linearGradient» (стоп-цвет) зависит от условия. Но не влияя на мои изменения.

Стрелка вверх-вниз работает нормально, но я не могу заполнить svg сверху или снизу в соответствии с моим условием

...