AngularJS - TypeError：v2。[xxxx]不是函數

我想基於它們的數組索引使用ng樣式有條件地設置div元素的背景位置。每個div都是使用ng repeat生成的。AngularJS - TypeError：v2。[xxxx]不是函數

在我的html頁面，我有下面的代碼片段：

<div style="position:absolute; z-index:1; width:100px; height:100px" ng-style="navigationStyleToilet(o)" ng-repeat="o in arr"></div>

在我controller.js，我有下面的代碼片段：

$scope.navigationStyleToilet = []; 
    $scope.arr = []; 
    // get data from service.js 
    var categoryInfo = NavigationService.fnGetCategoryInfo(strCategoryName); 

    for (i = 0; i < categoryInfo.length; i++) 
    { 
     $scope.arr.push(i); 
     var targetImageX = categoryInfo[i].X; 
     var targetImageY = categoryInfo[i].Y; 
     $scope.navigationStyleToilet[i] = { 
      "background-position": targetImageX + " " + targetImageY 
     } 
    }

不幸的是，它給我的錯誤說「TypeError：v2.navigationStyleToilet不是一個函數」。

我已經嘗試了幾個不同的事情，但是我不能有條件地使用ng-style基於它們的數組索引設置div元素的背景位置。有沒有人知道我可以做這項工作的方式？謝謝。

來源

2017-01-03 Antoni

你有$ scope.navigationStyleToilet內的值嗎？ – Sajeetharan

值？基本上，$ scope.navigationStyleToilet是一個ng格式的div。 div會重複生成，我想根據數組索引爲每個div有條件地設置不同的背景位置。順便說一句，我已經更新了我的問題，因爲我忘了提及我已經聲明並實例化$ scope.navigationStyleToilet = []; – Antoni

下面的答案是根據更新的問題！ –

如果你想從數組中獲取元素，你應該在數組中使用索引器。所以，你在NG-風格索引應該是

ng-style="navigationStyleToilet[o]"

您的代碼ng-style="navigationStyleToilet(o)"會認爲它的功能並以這種方式調用。所以，你應該使用索引器而不是調用函數。確保o應將索引值從數組中獲取數據。

如果你想獲得ng-repeat產生的索引，你可以使用$ index。所以，你的代碼可能是這樣的：

ng-style="navigationStyleToilet[$index]"

來源

2017-01-03 02:43:03

首先，你不需要爲此分離功能。

$scope.categoryInfo

和

<div style="position:absolute; z-index:1; width:100px; height:100px" ng-style="{'background-position': o.X + 'px ' + o.Y +'px' }" ng-repeat="o in categoryInfo">{{o}}</div>

這裏解決： https://plnkr.co/edit/Nh0Kp0zI77JIxcApTYSQ?p=preview

您可能忽略像素或％

您可以通過它改變穿上categoryInfo NG-重複在「背景位置」屬性中所要求的值中

但正如你所看到的（通過檢查元素）在上述plunkr都在div有「背景，地位」，那麼還他們overlapsing：

所以你可能會尋找這樣的事情：

ng-style="{'left': o.X + 'px ', 'top': o.Y +'px' }" ng-repeat="o in categoryInfo"

請看這裏：https://plnkr.co/edit/g0h7IsG1kSkNQmSLBDWY?p=preview

希望這會有所幫助。 :)

來源

2017-01-03 03:18:17

AngularJS - TypeError：v2。[xxxx]不是函數

回答

相關問題