相同的参数传递给HTML而不是按钮(Same parameter got passed into HTML but not button)

相同的参数传递给HTML而不是按钮(Same parameter got passed into HTML but not button)

我想在angularjs中传递一个参数。 请注意{{dish.id}}出现在下面两次，一次正确通过，另一次失败。

html模板是

<ion-popover-view> <ion-content> <button class="button button-full button-light" ng-click="addFavorite({{dish.id}})"> Add to favorites: dish {{dish.id}} </button> <button class="button button-full button-light" ng-click="addComment()">Add comment</button> </ion-content> </ion-popover-view>

控制器中的功能是

$scope.addFavorite = function (index) { console.log("added from DishDetail: index is " + index); favoriteFactory.addToFavorites(index); console.log("finished"); }

然而，奇怪的是视图中的两个{{dish.id}}，html中的一个被正确显示，而传递给fucntion的那个是“未定义的”

有人可以帮我解决这个问题吗？ 有点被困在这里几天，无法弄清楚自己。

谢谢！

I am trying to pass a parameter in angularjs. Please note the {{dish.id}} appear twice below, one was correctly passed, the other failed.

the html template is

<ion-popover-view> <ion-content> <button class="button button-full button-light" ng-click="addFavorite({{dish.id}})"> Add to favorites: dish {{dish.id}} </button> <button class="button button-full button-light" ng-click="addComment()">Add comment</button> </ion-content> </ion-popover-view>

the function in the controller is

$scope.addFavorite = function (index) { console.log("added from DishDetail: index is " + index); favoriteFactory.addToFavorites(index); console.log("finished"); }

However, the weird thing is for the two {{dish.id}} in the view, the one in html was correctly displayed while the one to pass into the fucntion is "undefined"

Could someone kindly help me on resolving this? Kinda be stuck here for a few days and couldnt figure out myself.

Thanks!

最满意答案

摆脱以ng为前缀的html属性中的插值，这些属性由$ scope处理。$ apply（）方法

<button class="button button-full button-light" ng-click="addFavorite(dish.id)">

Get rid of interpolation in ng- prefixed html attributes, those are handling by $scope.$apply() method

<button class="button button-full button-light" ng-click="addFavorite(dish.id)">