相同的参数传递到HTML而不是按钮

Question

我正在尝试传递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的那个是“未定义”

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

谢谢！

Answer 1

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

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