AngularJS - 控制器方法不會在ngClick上調用 - 沒有錯誤

如果單擊按鈕，我嘗試調用方法removePlayer(playerId)。但是，該方法沒有被調用，或者至少其內部的語句沒有被觸發，因爲我在頂部放置了一個console.log()聲明。AngularJS - 控制器方法不會在ngClick上調用 - 沒有錯誤

控制檯是空的，所以我真的很無能。這裏是我的代碼：

控制器：

function appController($scope) { 
    $scope.players = []; 
    var playercount = 0; 

    $scope.addPlayer = function(playername) { 

     $scope.players.push({name: playername, score: 0, id: playercount}); 
     playercount++; 
    } 

    function getIndexOfPlayerWithId(playerId) { 
     for (var i = $scope.players.length - 1; i > -1; i--) { 
      if ($scope.players[i].id == playerId) 
       return i; 
     } 
    } 

    $scope.removePlayer = function(playerId) { 
     console.log("remove"); 
     var index = getIndexOfPlayerWithId(playerId); 
     $scope.players.slice(index, 1); 
    } 
} 
appController.$inject = ['$scope'];

HTML：

... 
<table id="players"> 
     <tr ng-repeat="player in players"> 
      <td>{{player.name}}</td> 
      <td>{{player.score}}</td> 
      <td><button ng-click="removePlayer({{player.id}})">Remove</button></td> 
     </tr> 
    </table> 
...

來源

2012-11-08 11684

爲什麼玩家在控制器中而不是在模型中？ – LeeGee

我剛剛嘗試了AngularJS，只是爲了發現它是什麼。這不是一個「真正的」項目。 @LeeGee – 11684

你不應該使用在NG單擊表達大括號（{{ }}）進行。你應該寫：

<button ng-click="removePlayer(player.id)">Remove</button>

來源

2012-11-08 19:39:11

新的ng-repeat範圍是否僅從父範圍繼承？所以我的答案中的'$ parent'不需要？ – dnc253

是的，'ng-repeat'創建的作用域從父作用域繼承，所以不需要'$ parent'引用。事實上，人們應該避免使用'$ parent'，因爲它強烈地將事件處理程序中的表達式與模板結構鏈接起來（這足以插入另一個作用域創建指令並且事件可能會中斷）。 –

謝謝，這一切都有道理。我只記得在'ng-repeat'中看到使用'$ parent'的地方，並認爲這是問題所在。 +1給你。 – dnc253

ng-repeat創建一個新的範圍，所以不知道是什麼removePlayer是。你應該能夠做這樣的事情：

<table id="players"> 
    <tr ng-repeat="player in players"> 
     <td>{{player.name}}</td> 
     <td>{{player.score}}</td> 
     <td><button ng-click="$parent.removePlayer({{player.id}})">Remove</button></td> 
    </tr> 
</table>

見https://groups.google.com/forum/?fromgroups=#!topic/angular/NXyZHRTAnLA

來源

2012-11-08 19:31:34 dnc253

哇，我不知道這件事。現在試試！ – 11684

它不工作...任何想法？ – 11684

你可以創建一個重現問題的jsFiddle嗎？這將更容易診斷確切的問題。另外，我只注意到函數調用中的{{}}。我相信你在調用函數時不需要這些。 – dnc253

-1

如前所述，NG-重複創造它自己的範圍，外控制器範圍內不可用。但是，由於在JS使用的是真正的對象寫的東西是這樣的：

<tr ng-repeat="player in players"> 
    <td>{{player.name}}</td> 
    <td>{{player.score}}</td> 
    <td><button ng-click="player.removePlayer()">Remove</button></td> 
</tr>

在此之前，地方上的控制器初始化，您可以assing的「removePlayer」功能，您的每一個選手對象與自然的代碼在任何你想要的，從而間接訪問外部控制器。

來源

2013-08-28 18:06:06 jke

AngularJS - 控制器方法不會在ngClick上調用 - 沒有錯誤

回答

相關問題