2017-04-07 13 views
0

바인딩과 함께 새 슬라이드를 추가하면 plunker 데모입니다.이온 슬라이드 : <a href="http://embed.plnkr.co/7ROJ3l/?show=preview" rel="nofollow noreferrer">http://embed.plnkr.co/7ROJ3l/?show=preview</a></p> <p>내가 동적으로 특정 약속이 해결됩니다 후 이온 슬라이더에 슬라이드를 추가하려면이 사용 사례가 : 각도 범위 변수가 여기에

순수 HTML 텍스트를 Slider에 추가하는 것은 매우 간단합니다. 그러나 angular variables{{ }}을 사용하여 제 컨트롤러에서 바인딩하려고하면 처리되지 않습니다. 무슨 뜻인지 이해하려면 위의 plunker demo을 참조하십시오. 슬라이드를 추가 할 수있는 방법이 있습니까? 컨트롤러 범위 변수를 사용할 수도 있습니까?

해결 방법으로 새로운 슬라이드를 추가하는 대신 ng-repeat을 시도했습니다. http://embed.plnkr.co/CL9P4I/?show=preview

이 솔루션에서 나는 실수로 새로운 버그를 발견했다고 생각합니다. 여기서 두 번째 슬라이드 페이지는 여기에 언급 된 CSS 스타일을 제대로 따르지 않습니다. 슬라이더를 처음으로 스 와이프 한 후 정상적인 동작으로 되돌아갑니다. 명확한 아이디어를 얻으려면 Plunker을보십시오.

답변

0

편집 : 작업 Plunker https://plnkr.co/edit/wKsaRJ?p=preview

당신은 당신의 데이터 ng-repeat에 의해 통과 배열이나 객체를 생성해야합니다. 마찬가지로 : 당신의 <ion-slide-page> 내부

$scope.mySlides = ["test1", "test2", "test3"]; 

및 사용 ng-repeat. Like :

<ion-slide-page ng-repeat="slide in mySlider">{{ slide }}</ion-slide-page> 

Plunker 편집 나는 이러한 변경 작업을 성공적으로 마쳤습니다.

+0

신속한 답변을 보내 주셔서 감사합니다. 이것은 성공적으로 성공적으로 작동합니다. 하지만 내 질문에 언급했듯이'$ scope.mySlides' 배열은 약속이 해결 된 후에 업데이트해야합니다 (간단히 말해서 $ timeout을 사용했습니다). 슬라이드에 약간의 왜곡이 발생합니다. 이 plunker에서 볼 수 있습니다 : http://embed.plnkr.co/CL9P4I/?show=preview – Meliodas