ng樣式不起作用

Question

我試圖在選擇一個類別後改變顏色，我嘗試使用「ng樣式」。但它不起作用。

這是我的代碼的html：

<div ng-repeat="item in ListExpense" ng-class-odd="'item item-icon-left desc-expense a'" ng-class-even="'item item-icon-left desc-expense b'"> 
    <!-- this to change color --> 
    <i class="icon ion-ios-pricetags" ng-style="{'color': selectedColor[$index]}" ng-click="showPopover($event, $index, item.ExpenseId, item.CategoryId)"></i> 

    <div class="col description" ng-click="showEditExpense(item.ExpenseId)">{{ item.Title }}</div> 
    <div class="col cost" ng-bind="item.Amount | currency:'':0"></div> 
    </div> 

爲彈出這個我的代碼：

<div id="popup"> 
<ion-scroll style="height: 190px;"> 
    <label ng-repeat="item in ListCategory" for="{{item.Name}}"> 
    <input type="radio" 
      ng-model="myCategory" 
      ng-value="item.CategoryId" 
      ng-click="closeInController(item.CategoryId, ItemId, paramDate)" 
      id="{{item.CategoryId}}" 
      name="category"> 
    {{item.Name}} 
    <br> 
</label> 
</ion-scroll> 
</div> 

，這我contoller.js，並顯示彈出菜單以選擇類別：

// Controller Popover tags expense 
.controller('PopOver', function($scope, $ionicPlatform, $ionicPopover, Category, Expense) { 
$ionicPlatform.ready(function() { 
$scope.myFormCat = {}; 
$scope.myFormCat.name = "Audit Form"; 
$scope.myFormCat.submitCategory = function(ExpenseId, event) { 
    var theCategory = $scope.myFormCat.Category; 
    if (theCategory === undefined) { 
     // 
    } else { 
     var cat = {}; 
     cat.Name = theCategory; 
     cat.Type = 'D'; 
     Category.add(cat).then(function(res) { 
      var lastId = res.insertId; 
      Expense.updateCategory(lastId, ExpenseId); 
     }); 
     Category.all('D').then(function(res) { 
      $scope.ListCategory = res; 
     }); 

     $scope.myFormCat.Category = ''; 

     $scope.popover.hide(); 
    } 
}; 

var d = new Date(); 
var mm = d.getMonth(); 
var dd = d.getDate(); 
var yy = d.getFullYear(); 


Category.all('D').then(function(res) { 
    console.log(res); 
    console.log("inilah " + res.length); 
    if (res.length > 0) { 
     $scope.ListCategory = res; 
    } else { 

    } 
}) 

//beware of month is month + 1 
Expense.totalPerCategory(mm+1, yy).then(function(res) { 
    console.log(res); 
    $scope.TagColor = {}; 
    for (i = 0; i < res.length; i++) { 
     $scope.TagColor[res[i].CategoryId] = { 
      color: res[i].BgColor, 
      label: res[i].CategoryName 
     }; 
    } 
}) 

$ionicPopover.fromTemplateUrl('templates/popoversss.html', { 
scope: $scope, 
}).then(function(popover) { 
$scope.popover = popover; 
}); 

$scope.showPopover = function($event, index, ExpenseId, CategoryId) { 
    console.log(CategoryId); 
$scope.myCategory = CategoryId; 
$scope.item_index = index; 
$scope.ItemId = ExpenseId; 
$scope.popover.show($event);// 
} 

$scope.closeInController = function(selectedItem, ExpenseId, paramDate, color, cindex) { 

    Expense.updateCategory(selectedItem, ExpenseId); 
    Expense.getByDate(paramDate).then(function(res) { 
    console.log(res); 
    $scope.ListExpense = res; 
}); 
    $scope.popover.hide(); 
    $scope.selectedColor = {}; 
    $scope.selectedColor[cindex] = color; 
    console.log(cindex + ' -- ' + color); 
}; 

}); 
}) 

我得到錯誤undefined - undefined。 任何人都可以幫助我？

在此先感謝

Answer 1

試圖改變你的代碼：

Expense.totalPerCategory(mm+1, yy).then(function(res) { 
    console.log(res); 
    $scope.ListExpense = []; 
    for (i = 0; i < res.length; i++) { 
     $scope.ListExpense.push({ 
      color: res[i].BgColor 
     }; 
    } 
}) 

Answer 2

見我的回答類似的問題在這裏：ng-style blues 也許你可以用「風格」嘗試相反，所以更改您的代碼：

<i class="icon ion-ios-pricetags" style="color:selectedColor[$index]" ng-click="showPopover($event, $index, item.ExpenseId, item.CategoryId)"></i> 

並試試看。如果失敗了，我會嘗試創建一個返回樣式字符串的函數（即「color：whatever-color-goes-」），並將樣式更改爲「style = colorFunct（selectedColor [$ index]）「，看看是否有效。

HTH，問候。