當我嘗試訪問參數時變得不確定

Question

我正在嘗試訪問傳遞給JavaScript函數的參數並提醒該值。 但是當我警報值時，我在警報中變得undefined 。 我在這里做錯了什么。

html

<div ng-app="plusminusApp" ng-controller="categorylist">        
    <div class="whitescreen" id="buttons-overlay">
        <div class="icons-container">
            <div class="icons-inside-container">
            <div ng-repeat="category in categories" value="{{category.picture}}" class="category-icon-thumbnail" onclick="setCategory(this.value);">
                        <img value="{{category.category}}" src="{{category.picture}}">
            </div>
            </div>
        </div>
    </div>
</div>

app.js

function setCategory(category){
    alert(category)
    document.getElementById('buttons-overlay').style.display = 'none';
}

Answer 1

如果要將角度的范圍值傳遞給函數，則它必須是ng-前綴的事件。 您不能將范圍變量傳遞給角度上下文之外的函數。

      <div ng-repeat="category in categories" value="{{category.picture}}" class="category-icon-thumbnail" ng-click="setCategory(category.picture)">

並且該函數必須在控制器的范圍內，這意味着您需要定義$scope.setCategory = function(val){}

Answer 2

HTML：

<div ng-app="plusminusApp" ng-controller="categorylist">        
<div class="whitescreen" id="buttons-overlay">
    <div class="icons-container">
        <div class="icons-inside-container">
        <div ng-repeat="category in categories"class="category-icon-thumbnail" >
            <img value="{{category.category}}" src="{{category.picture}}" ng-click="setCategory(category.picture);">
        </div>
        </div>
    </div>
</div>

JS：

$scope.setCategory = function(val){
     console.log(val)
 }

Answer 3

假設這是您的json

$scope.categories = [{
    'category': 'ABC',
    'picture': 'https://randomuser.me/api/portraits/men/22.jpg'
  }, {
    'category': 'ced',
    'picture': 'https://randomuser.me/api/portraits/men/13.jpg'
  }]

使用下面的代碼

$scope.setCategory =function(category) {
    $scope.something=category;

    document.getElementById('buttons-overlay').style.display = 'none';
  }



<div ng-app="plusminusApp" ng-controller="categorylist">
    <p>Hello!</p>
    <div class="whitescreen" id="buttons-overlay">
      <div class="icons-container">
        <div class="icons-inside-container">
          <div ng-repeat="category in categories" value="{{category.picture}}" class="category-icon-thumbnail">
            <button ng-click="setCategory(category.category)"> {{category.category}}
            </button>
            <img value="{{category.category}}" src="{{category.picture}}">
          </div>
        </div>
      </div>

    </div>
  </div>

為簡單起見，我將click事件從div更改為button。

現場演示