{{}} 在 ng-click 和 ng-repeat 中

Question

这是我的代码 HTML

<div id="container" ng-app="containArea" ng-controller="myCtrl">
<div id="sidebody" class="block">
    <button 
      ng-repeat="shopli in shopName" 
      ng-click="openurl({{'\''+shopli.url+'\''}})" 
      class="btn_shopList">
      {{shopli.name}}
    </button>
</div>
 ........
</div>

还有这里的 JS

var app = angular.module('containArea', []);
app.controller('myCtrl', function($scope) {
    $scope.shopName=[
        {
          "name":'momo購物網',
          "url":'https://buyforfun.biz/2LvEY'
        },
        {
          "name":'金石堂書局',
          "url":'https://joymall.co/2MX4o'
        }
    ]; 
    $scope.openurl = function(url){
         window.open(url, '_blank');
    }
});

{{shopli.name}}正确输出

但是如果我点击按钮，什么也没有发生

谁能帮我解决一下

Answer 1

直接在 ng-click 函数中使用值，而不是使用 angular 表达式 {{}}。

ng-click="openurl('\''+shopli.url+'\'')"

var app = angular.module('containArea', []);
app.controller('myCtrl', function($scope) {
  $scope.shopName = [{
      "name": 'momo購物網',
      "url": 'https://buyforfun.biz/2LvEY'
    },
    {
      "name": '金石堂書局',
      "url": 'https://joymall.co/2MX4o'
    }
  ];
  $scope.openurl = function(url) {
    console.log(url);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div id="container" ng-app="containArea" ng-controller="myCtrl">
  <div id="sidebody" class="block">
    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">
      {{shopli.name}}
    </button>
  </div>
</div>

{{}} 在 ng-click 和 ng-repeat 中

{{}} in ng-click & ng-repeat

angularjs

angularjs-ng-repeat

angularjs-ng-click