3

我想顯示一個列表的元素感謝ngSwitch,但我不知道如何處理ngRepeat。我已經開始做沒有列表,只是爲了瞭解ngSwitch如何工作,並告訴你我想做什麼,這裏是一個jsFiddle,這將有助於你明白:jdFiffle 1AngularJS - ngSwitch和ngClick不能在ngRepeat工作

然後,我嘗試使用列表ngRepeat但是,無論我嘗試做什麼,它都不起作用。這裏有一個第二的jsfiddle用,這個時候,使用列表:jsFiddle 2

似乎ngClickngSwitch當他們是ngRepeat內不工作......我該怎麼做才能使事情的工作?提前致謝!

回答

11

一些問題:

  1. 當角指令處理,你通常不需要使用{{...}}語法,只需使用真正值。因此,而不是:

    data-ng-click="sw='{{test.name}}'" 
    

    使用:

    data-ng-click="sw = test.name" 
    

    (見爲什麼這是不夠的下一個點)

  2. ng-repeat使用它自己的範圍與transclusion,所以以上將sw設置在錯誤的範圍內,使用:

    data-ng-click="$parent.sw = test.name" 
    
  3. 你不能ng-repeat建立ng-switch-when的,儘量ng-show/hide而不是嘗試:

    <div ng-repeat="test in tests" ng-show="sw == test.name"> 
    

演示:http://jsbin.com/uxobot/1/


但所有的一切,我沒有看到在第二個div上需要ng-switch/ng-repeat。下面有同樣的效果,可能是更大量的語義:

<div ng-controller="MyCtrl"> 
    <div class="click"> 
    <div ng-repeat="test in tests" data-ng-click="$parent.active = test"> 
     {{test.name}} 
    </div> 
    </div> 

    <div class="switch"> 
    {{active.text}} 
    </div> 
</div> 

演示:http://jsbin.com/elufow/1/

+0

非常感謝,這正是我需要的! :) – Sylla