Question

我正在尝试显示基于品牌的产品，但是ng-click内部ng-repeat不起作用。但是在ng-repeat工作正常之外进行ng-click。 ng-repeat中是否有任何冲突...？

模块

var myApp = angular.module('myapplication', ['ngRoute', 'ngResource','uiSlider']);

我的观点

<a style="cursor:pointer" ng-click="Brandfilters = ''">All Brands</a>

<div class="list-group-item" ng-repeat="product in products | unique: 'brand'" >
   <a style="cursor:pointer" ng-click="Brandfilters='{{product.brand}}'">{{product.brand}}</a>
</div>

我的控制器

myApp.controller("StoreListCtr", ['$scope', '$http', '$resource',  '$location', 
      function($scope, $http, $resource, $location) {

        $scope.products = Products.query();
        $scope.Brandfilters = null;
        $scope.lower_price = 100;
        $scope.upper_price = 500;

        $scope.priceRange = function(products) {
          return (products['cost'] >= $scope.lower_price 
                          && products['cost'] <=$scope.upper_price);
        };
}])

Answer 1

试试

<div class="list-group-item" ng-repeat="product in products | unique: 'brand'" >
   <a style="cursor:pointer" ng-click="Brandfilters ='product.brand'">{{product.brand}}</a>
</div>

Answer 2

ng-repeat中的代码是评估代码，因此您不必使用{{}}。

<div class="list-group-item" ng-repeat="product in products | unique: 'brand'" >
   <a style="cursor:pointer" ng-click="Brandfilters = product.brand">{{product.brand}}</a>
</div>

Answer 3

工作示例 - http://plnkr.co/edit/DnTE05Vpo6erMgfpQQjo?p=preview

试试这个 -

替换 -

<a style="cursor:pointer" ng-click="Brandfilters='{{product.brand}}'">{{product.brand}}</a>

用

 <a style="cursor:pointer" ng-click="setBrand(product.brand)">{{product.brand}}</a>

在控制器中

$scope.setBrand = function(brandName) {
      $scope.Brandfilters = brandName;
}

Answer 4

您可能需要将正确的指令（可能是'ui.directives'）注入模块，或者它可能是ui.utils？

var myApp = angular.module('myapplication', 
                               ['ngRoute', 'ngResource','uiSlider', 'ui.directives']);

查看文档时，您可能需要ui.utils ...

var myApp = angular.module('myapplication', 
                               ['ngRoute', 'ngResource','uiSlider', 'ui.utils']);

请参阅GitHub资源。

ng-click在ng-repeat

4 个答案: