Nachdem ich lange nach diesem Problem gesucht hatte, entschloss ich mich, meine erste Frage in StackOverflow zu stellen. Ich hoffe jemand kann mir helfen.

Ich mache ein ui.bootstrap.carousel mit verschiedenen Folien. Die anfängliche Struktur ist die folgende:

    <carousel interval="carInterval" no-pause="true">
      <slide>
        some html content, {{ modules }}
      </slide>
      <slide>
        totally different conte,nt, {{ more variables }}
      </slide>
    </carousel>

Das hat am Anfang sehr gut funktioniert, auch ohne ng-repeat und jede aktive Anweisung. Das Problem begann, als ich eine benutzerdefinierte goToSlide () - Schaltfläche festlegen wollte. Als ich mich umsah, stellte ich fest, dass ich das nur mit der ng-repeat-Syntax machen kann (die normale und von bootstrap vorgegebene). Als ich dies versuchte, musste ich den gesamten Inhalt der Folien in der Javascript-Datei deklarieren.

    angular.module('anyApp')
      .controller('MainCtrl', function ($scope) {
        $scope.anyModule="Anything"
        $scope.slider=[]
        $scope.slider.push({ content: " \
            <h1> html content {{ anyModule }} </h1> \
            "});
      });

Dann im HTML:

    <carousel interval="myInterval" no-wrap="noWrapSlides">
       <slide ng-repeat="slide in slides" active="slide.active">
         <p ng-bind-html="slide.content"> </p>
       </slide>
    </carousel>

Der HTML-Inhalt wird gut angezeigt, aber die Variablen werden nicht angezeigt. Ich habe auch folgendes versucht:

$scope.slider.push({ content: " \
    <h1> html content <p ng-bind-template='{{ anyModule }} '></p></h1> "});

Wenn Sie eine mögliche Lösung für dieses Problem kennen oder nur einen aktiven Schieberegler festlegen, der sich nicht in der ng-repeat-Syntax befindet, würde ich das sehr begrüßen.

Danke für Ihre Aufmerksamkei