Question

我遇到的问题是我的角度代码在firefox中工作但不在chrome中。

浏览器控制台打印出：

TypeError: undefined is not a function
    at setSelectedColor (http://localhost:3000/assets/products/controllers/mens_detail_controller.js?body=1:24:54)

这是我的控制器（注意失败发生地的console.log）：

app.controller('MensDetailCtrl', ['$scope', '$resource', '$controller', 'Product', function($scope, $resource, $controller, Product) {
  $controller('ProductsDetailCtrl', {$scope: $scope});

  $scope.init = function(id, locale, selected_color_id)
  {
    $scope.product = Product.get({productId: id, locale: locale}, function(data) {
      var unsorted_products_colors = data.products_colors.filter(function(product_color) {
        return product_color.mens == true;
      });

      $scope.products_colors = unsorted_products_colors.sort(function(a, b) {
        return a.mens_sort_order > b.mens_sort_order;
      });

      setSelectedColor(selected_color_id);
    });

  }

  var setSelectedColor = function(selected_color_id) {
    console.log("ffff"); //prints
    if (selected_color_id) {
      console.log("eeeffff"); //prints
      // the error seems to happen at this next line, which is line 24:
      $scope.selected_color = $scope.products_colors.find(function(el) {
        return el.id == selected_color_id;
      });
    } else {
      console.log("hhffff");
      $scope.selected_color = $scope.products_colors[0];
    }
    console.log("ffffzzz"); // does NOT print

    $scope.selected_variant = $scope.selected_color.variants[0];
    $scope.sorted_product_images = $scope.selected_color.product_images.sort(function(a, b) {
      return a.sort_order > b.sort_order;
    });
    $scope.selected_image = $scope.sorted_product_images[0];
  }


}]);

为什么它在Firefox上完全正常，但在Chrome上却没有？我该如何解决这个问题？

==更新== 即使我在崩溃之前打印出$scope.products_colors的值，它也会在浏览器控制台中打印出一个对象：

ffff
eeeffff 
[Object]0: Object$$hashKey: "004"color: Objectcolor_id: 32created_at: "2014-08-12T19:47:32.000Z"id: 91mens: truemens_sort_order: 0product_id: 15product_images: Array[2]updated_at: "2014-08-12T19:47:32.000Z"variants: Array[1]womens: truewomens_sort_order: 0__proto__: Objectlength: 1__proto__: Array[0]

==更新2 ==

删除.find(...)并将其替换为数组下标可以修复错误，但它并没有修复错误，因为我需要抓取具有某个属性的元素：

  var setSelectedColor = function(selected_color_id) {
    if (selected_color_id) {
      // $scope.selected_color = $scope.products_colors.find(function(el) {
      //         return el.id == selected_color_id;
      //       });
      $scope.selected_color = $scope.products_colors[0]
    } else {
      $scope.selected_color = $scope.products_colors[0];
    }

    $scope.selected_variant = $scope.selected_color.variants[0];
    $scope.sorted_product_images = $scope.selected_color.product_images.sort(function(a, b) {
      return a.sort_order > b.sort_order;
    });
    $scope.selected_image = $scope.sorted_product_images[0];
  }

Answer 1

我通过将.find替换为.filter(...)[0]

来修复它

AngularJS：Array.prototype.find（）在Chrome中不起作用

1 个答案: