Próbuję poradzić sobie z problemem zasięgu wewnątrz pętli ng-repeat - przeglądałem kilka pytań, ale nie byłem w stanie uruchomić mojego kodu.
Kod kontrolera:
function Ctrl($scope) {
$scope.lines = [{text: 'res1'}, {text:'res2'}];
}
Widok:
<div ng-app>
<div ng-controller="Ctrl">
<div ng-repeat="line in lines">
<div class="preview">{{text}}{{$index}}</div>
</div>
<div ng-repeat="line in lines">
<-- typing here should auto update it's preview above -->
<input value="{{line.text}}" ng-model="text{{$index}}"/>
<!-- many other fields here that will also affect the preview -->
</div>
</div>
</div>
Oto skrzypce: http://jsfiddle.net/cyberwombat/zqTah/
Zasadniczo mam obiekt (jest to generator ulotek), który zawiera wiele wierszy tekstu. Każdy wiersz tekstu może zostać zmodyfikowany przez użytkownika (tekst, czcionka, rozmiar, kolor itp.) I chcę utworzyć dla niego podgląd. Powyższy przykład pokazuje tylko pole wejściowe do wprowadzania tekstu i chciałbym, aby automatycznie / podczas pisania aktualizowało podgląd div, ale będzie znacznie więcej elementów sterujących.
Nie jestem też pewien, czy mam odpowiedni kod dla indeksu zapętlonego - czy to najlepszy sposób na utworzenie nazwy modelu ng w pętli?