Ionic & AngularJS：ng-repeat中的变量？

我是ionic的新手（和stackoverflow ;-)），但是我的应用程序几乎已经完成了一件小事，我需要您的帮助！

我有一个详细视图（produktdetail.html），其中我必须放置一个离子 - 滑动盒。此幻灯箱应包括NG-RPEAT，例如：

<ion-slide ng-repeat="steps in Clicker"></ion-slide>

这很好。但是我必须用动态变量替换"点击器"，我将通过详细信息传递。当我放

{{produkt.cards_name}}

进入模板中，它可以找到发现，我看到了" clicker"一词。但是，当我用它替换离子滑动中的"点击器"时，我看不到任何东西。我该如何修复？

这是一些代码。

（controller.js）

.controller('BrowseCtrl', function($scope, ProduktService){
$scope.productList = ProduktService.getAll();
})
.controller('ProduktDetailCtrl', function($scope, $stateParams, ProduktService){
    var produktId = $stateParams.produktName;
    $scope.produkt = ProduktService.getSelected(produktId);
      $scope.Clicker = [
    { title: 'Reggae', id: 1 },
    { title: 'Lulu', id: 1 },
    { title: 'Blabla', id: 1 }
    ];
})
.controller('CoachCtrl', function(){
})
;

（app.js）

.factory('ProduktService', function(){
    var productList = [
        {name: "Der Clicker",
         txt: "Das Training mit dem Clicker ist eine einfache, aber sehr effektive Methode des Hundetrainings. Über die Funktionsweise des Clickers erfährst du hier mehr.",
         img_pre: "../www/img/kurse/preview/Clicker_pre.jpg",
         img_de: "../www/img/kurse/detail/Clicker.png", 
         cards_name: "Clicker",
         trailer: "https://www.youtube-nocookie.com/embed/kPsrI0cW1EQ?rel=0&amp;showinfo=0",
         be1: "10",
         be2: "5",
         be3: "2",
        },
        {name: "Das Platz",
         txt: "Neben 'Sitz' ist Platz eines der Signale, dass du deinem Hund am häufigsten geben wirst. Somit ist 'Platz' eine absolute Basic Übung.",
         img_pre: "../www/img/kurse/preview/platz_pre.jpg",
         img_de: "../www/img/kurse/detail/Platz.jpg",
         cards_name: 'Platz',
         trailer: "https://www.youtube-nocookie.com/embed/kTcbNF3Bq14?rel=0&amp;showinfo=0",
         be1: "7",
         be2: "3",
         be3: "2",
        },
        {name: "Das Sitz",
         txt: "Gemeinsam mit dem Signal 'Platz' ist 'Sitz' eines der Signale, dass du deinem Hund am häufigsten geben wirst. Damit ist auch dieses Signal eine absolute Basic Übung.",
         img_pre: "../www/img/kurse/preview/sitz_pre.jpg",
         img_de: "../www/img/kurse/detail/Sitz.jpg",
         cards_name: 'Sitz',
         trailer: "https://www.youtube-nocookie.com/embed/VRKlvi2F-y0?rel=0&amp;showinfo=0",
         be1: "7",
         be2: "3",
         be3: "2",
},
    ];
    var treffer;
    return{
        getAll: function(){
            return productList;
        },
        getSelected: function(produkt_name){
            productList.forEach(function(object){
                if(angular.equals(object.name, produkt_name)){
                    treffer = object;
                }
            })
            return treffer;
        }
    }
})

（Browse.html-主视图）

<ion-view view-title="Kurse">
  <ion-content>
      <ion-list>
          <ion-item class="item item-avatar item-icon-right" ng-repeat="produkt in productList" ng-href="#/app/browse/{{produkt.name}}">
            <img src="{{produkt.img_pre}}" id="img_preview">
            <h2>{{produkt.name}}</h2>
            <p>{{produkt.txt}}</p>
            <i class="icon ion-ios-arrow-right"></i>
          </ion-item>
      </ion-list>
      <br>
  </ion-content>
</ion-view>

and last：produktdetail.html（详细信息）

<ion-view view-title="{{produkt.name}}">
  <ion-content>
      <div class="responsive-video">
<iframe src="{{produkt.trailer}}" frameborder="0" allowfullscreen></iframe>
</div>          
      <p class="desc">{{produkt.txt}}</p>
      <br>
<ion-slide-box show-pager="false">
    <ion-slide ng-repeat="steps in Clicker">
        <div class="card">
        <div class="item item-divider">
            <h2>{{steps.title}}</h2>
        </div>
        <div class="item item-text-wrap">
        </div>    
    </div>
  </ion-slide>
</ion-slide-box>
  </ion-content>
</ion-view>

希望您理解我的意思 - 期待收到您的回音！

{{...}}仅用于表达式（字符串或数字）。对象将转换为字符串。尝试更改可变点击器的值，而不是可变本身。或者$ scope.clicker = {ret：[...]，ter：[...]}和html：ng-repeat =" clicker [product.cards_name]中的步骤

相关内容

最新更新

热门标签：