2014-10-30 64 views
0

如何获得脚本标记内部的角度表达式......我对此很新,需要帮助吗? 这里是我的Java脚本代码的例子:如何在脚本标记中使用角度表达式

<script id="modal-2.html" type="text/ng-template"> 
    <div class="modal transparent"> 
     <div class="card"> 
      <i class="icon ion-ios7-close close-modal" ng-click="closeModal(2)"></i> 
      <div class="item item-divider"> 
       {{card.title}} 
      </div> 
      <div class="item item-text-wrap"> 
       {{card.details}} 
      </div> 
     </div> 
    </div> 
</script> 

这里是我的数组的一个例子:

.controller('TodoCtrl', function($scope, $ionicPopup, $timeout, $ionicModal, $ionicSideMenuDelegate) { 

    $scope.cardss = 
    {id:1, title:'Frank', src:'img/Frank.png',details:'This will be the products description!'}, 
    {id:2, title:'Generali', src:'img/Generali.png',details:'This will be the products description!'}, 
    {id:3, title:'John Lewis', src:'img/JohnLewis.png',details:'This will be the products description!'}, 
    ]; 
+0

不知道你到底想要做什么...为什么把html放在脚本标记中? – user2717954 2014-10-30 09:09:26

回答

0

你的卡在控制器的阵列,所以你需要通过使用迭代他们ng-repeat

<script id="modal-2.html" type="text/ng-template"> 
<div class="modal transparent"> 
<div class="card" ng-repeat="card in cardss"> 
<i class="icon ion-ios7-close close-modal" ng-click="closeModal(2)"></i> 
<div class="item item-divider"> 
{{card.title}} 
</div> 
<div class="item item-text-wrap"> 
{{card.details}} 
</div> 
</div> 
</div> 
</script> 

在您的例子中,数组是缺少左方括号这样的阵列将是这样的:

$scope.cardss = [ 
    {id:1, title:'Frank', src:'img/Frank.png',details:'This will be the products description!'}, 
    {id:2, title:'Generali', src:'img/Generali.png',details:'This will be the products description!'}, 
    {id:3, title:'John Lewis', src:'img/JohnLewis.png',details:'This will be the products description!'}, 
    ]; 
+0

如果我不想重复内容,该怎么办?我只想从卡内的数组中获得1个标题和1个细节? – Garrett 2014-10-30 10:13:36

+0

然后你需要像这样cardss [0] .title访问它,其中0是你想要访问的数组中元素的索引 – V31 2014-10-30 11:08:36

+0

谢谢...你能提供一个例子吗? – Garrett 2014-10-30 11:18:14

0

没有什么特别的WRT里面使用部分模板AngularJS表达式。

前面已经说了你的模型实际上是阵列 - 所以你必须通过使用ng-repeat这样的项目迭代:

<ul> 
    <li ng-repeat="card in cards"> 
     Card id: {{card.id}} 
     Card title: {{card.title}} 
     Card details: {{card.details}} 
    </li> 
</ul> 

请参阅工作JSFiddle例子。

相关问题