0
웹 응용 프로그램은 Angularjs로 작성되었습니다. ng-repeat 지시문을 사용하여 여러 행이있는 테이블을 작성하는 HTML 페이지가 있습니다. 각 행에는 버튼이 있습니다. 버튼에는 둥근 모서리와 그라디언트 색상이 있습니다.Angularjs가있는 CSS3Pie - ng-repeat 지시문을 사용할 때 CSS3Pie의 효과는 첫 번째 요소에만 적용됩니다.
우리는 IE8을 지원해야합니다. 따라서 현대적인 브라우저에서와 같은 느낌을 내기 위해 CSS3Pie를 사용하기로 결정했습니다. & htc 파일 (js 버전 아님)을 사용하고 있으며 ng-repeat에서 해당 문제가 발생할 때까지 모든 것이 잘 진행되었습니다. 필요에 따라 첫 번째 행의 버튼 만 표시되고 나머지는 그라디언트가없는 이전 사각형 스타일을 유지합니다. 여기에 스크린 샷을 향한 링크입니다 : 두 번째 행에 대해
<CSS3-CONTAINER style="Z-INDEX: auto; POSITION: absolute; DIRECTION: ltr; TOP: 46px; LEFT: 1125px">
<BACKGROUND style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<GROUP2>
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "1000,1000">
<css3vml:fill></css3vml:fill>
<css3vml:fill></css3vml:fill>
</css3vml:shape>
</GROUP2>
</BACKGROUND>
<BORDER style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "1000,1000">
<css3vml:stroke></css3vml:stroke>
<css3vml:stroke></css3vml:stroke>
</css3vml:shape>
</BORDER>
</CSS3-CONTAINER>
<css3-container style="Z-INDEX: auto; POSITION: absolute; DIRECTION: ltr; TOP: 46px; LEFT: 1119px" jQuery1110014396690653581418="155" href="#/admin/competences/edit/385">
<background style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<group2>
<?xml:namespace prefix = css3vml ns = "urn:schemas-microsoft-com:vml" />
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "72,44" coordorigin = "1,1" fillcolor = "#660" stroked = "f" path = " m0,6 qy6,0 l66,0 qx72,6 l72,38 qy66,44 l6,44 qx0,38 x e">
<css3vml:fill></css3vml:fill>
<css3vml:fill></css3vml:fill>
</css3vml:shape>
</group2>
</background>
<border style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "72,44" coordorigin = "1,1" filled = "f" stroked = "t" strokecolor = "#616100" strokeweight = ".75pt" path = " m1,6 qy6,1 l66,1 qx71,6 l71,38 qy66,43 l6,43 qx1,38 x e">
<css3vml:stroke></css3vml:stroke>
<css3vml:stroke></css3vml:stroke>
</css3vml:shape>
</border>
</css3-container>
<BUTTON class="btn btn-primary btn-xs pie_first-child " type=submit data-ui-sref="admin.competences.edit({competenceId:competence.id})" _pieId="_52">edit</BUTTON>
의 일부 : Table column with buttons
내가 IE 개발자 도구 체크, 나는 첫 번째 행에있는 버튼에 대한 다음과 같은 소스 코드를 발견
<CSS3-CONTAINER style="Z-INDEX: auto; POSITION: absolute; DIRECTION: ltr; TOP: 46px; LEFT: 1125px">
<BACKGROUND style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<GROUP2>
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "1000,1000">
<css3vml:fill></css3vml:fill>
<css3vml:fill></css3vml:fill>
</css3vml:shape>
</GROUP2>
</BACKGROUND>
<BORDER style="POSITION: absolute; TOP: 0px; LEFT: 0px">
<css3vml:shape style="POSITION: absolute; WIDTH: 36px; HEIGHT: 22px; TOP: 0px; BEHAVIOR: url(#default#VML); LEFT: 0px" coordsize = "1000,1000">
<css3vml:stroke></css3vml:stroke>
<css3vml:stroke></css3vml:stroke>
</css3vml:shape>
</BORDER>
</CSS3-CONTAINER>
<BUTTON class="btn btn-primary btn-xs pie_first-child" type=submit data-ui-sref="admin.competences.edit({competenceId:competence.id})" jQuery1110014396690653581418="163" _pieId="_52" href="#/admin/competences/edit/907">edit</BUTTON>
내가 필요에 따라 그 일을 할 수있는 솔루션이 있는지 알고 싶습니다 : 다음 블록에서 볼 수 CSS3Pie에 의해 생성 된 코드는 없습니다.
CSS3Pie의 자바 스크립트 버전을 사용하려고 생각했지만 그 전에는 CSS3Pie의 htc 버전으로 목표를 달성 할 가능성이 없음을 확인하고 싶습니다.