NG-開關內部NG重複不工作

我有一個基本上可以歸結爲這樣的數據：NG-開關內部NG重複不工作

function ExampleCtrl($scope) { 
    $scope.myData= [ 
     {text: "blah", other: 3, V: 'caseOne'}, 
     {text: "blah", other: 3, V: 'caseTwo'}, 
     {text: "blah", other: 3, V: 'caseThree'} 
    ]; 
}

這是正在使用這樣的：

<div ng-controller="ExmapleCtrl"> 
    <table> 
     <tr> 
      <td>Text</td> 
      <td>Other</td> 
      <td>V</td> 
     </tr> 
     <tr ng-repeat="data in myData"> 
      <td><a href="#">{{data.text}}</a></td> 
      <td>{{data.other}}</td> 
      <td ng-switch on="data.V"> 
       <td ng-switch-when="caseOne"><img src="assets/img/pass.png"/></td> 
       <td ng-switch-when="caseTwo"><img src="assets/img/pass.png"/></td> 
       <td ng-switch-when="caseThree"><img src="assets/img/fail.png"/></td> 
      </td> 
    </table> 
</div>

的問題是是，我收到此錯誤：

Error: No controller: ngSwitch..

我已清楚控制器設置爲ExampleCtrl，我看不出有任何輸入錯誤，所以我很茫然unfortunat伊利。

來源

2013-05-21 Alex

如果將'ng-switch on =「data.V」'更改爲'ng-switch =「data.V」'，該怎麼辦？ – Dogbert

沒有效果，不幸的是:( – Alex

我知道這是超級遲了，你解決了你的問題，但在你的HTML中，你拼寫控制器「ExmapleCtrl」而不是「ExampleCtrl」，所以肯定角沒有找到它:) –

我認爲這個問題與產生無效標記的ng-switch有關。我不確定你可以在另一個td之內嵌套td。不管怎麼說，如果你改成這樣它會工作：

<td ng-switch on="data.V"> 
      <img src="assets/img/pass.png" ng-switch-when="caseOne"/> 
      <img src="assets/img/pass.png" ng-switch-when="caseTwo"/> 
      <img ng-switch-when="caseThree" src="assets/img/fail.png"/> 
     </td>

這裏是一個工作演示：http://plnkr.co/edit/zUdkJYfnlJul6HsyCGfZ

我會繼續前進，建議不要使用一個開關，可能一對夫婦更多的解決方案稍微好一點。退房的最後兩個td的

<tr ng-repeat="data in myData"> 
      <td><a href="#">{{data.text}}</a></td> 
      <td>{{data.other}}</td> 

      <td> 
       <img src='assets/img/{{data.V}}.png' /> <!-- assuming you have an image with name caseOne.png/caseTwo.png/etc --> 
      </td> 
      <td> 
      <img src='{{passFail[data.V]}}' /> <!-- transform the case stuff to pass/fail based on some business rules, this is an object but could be a function--> 
      </td> 
     </tr> 

$scope.passFail = { 
    'caseOne' : 'assets/img/pass.png', 
    'caseTwo' : 'assets/img/pass.png', 
    'caseThree' : 'assets/img/fail.png' 
};

來源

2013-05-21 16:03:05 lucuma

輝煌，謝謝。我的印象是，帶有'ng-switch on ='標籤的容器將被替換爲具有正確大小寫的容器。所以我認爲我的開關td會被我的情況td取代，但它似乎並不是那種方式。謝謝！ – Alex

沒問題，我用一些你也可能喜歡的非開關選項更新了答案。 – lucuma

如果在每個td裏面，沒有其他的html外部標籤，那麼如果我們想檢查用戶角色與存儲的數字（比如1-admin，2-moderator等）並且用相應的角色替換numebrs，就像純文本一樣。是否可以使用開關完成？我知道，如果我們在每個td內放置一個span標籤，這是可能的。如果存在「更好的開關方式」 – jayadevkv

一個附加上述答案櫃面如果只是裏面像開關外殼的用戶角色什麼的TD純文本，您可以添加TD內的跨度標籤包含文本

<td ng-switch="role"> 
    <span ng-switch-when="1">Administrator</span> 
    <span ng-switch-when="2">Moderator</span> 
</td>

來源

2017-02-20 12:04:04 jayadevkv

NG-開關內部NG重複不工作

回答

相關問題