Question

我尝试在选择类别后更改颜色，我尝试使用＆＃34; ng-style＆＃34;。但它不起作用。

这是我的代码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);
};

});
})

我得到错误未定义 - 未定义。有人可以帮帮我吗？

提前致谢

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 也许你可以试试＆＃34; style＆＃34;相反，所以将您的代码更改为：

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

并尝试一下。如果失败了，我会尝试创建一个返回样式字符串的函数（即＆＃34; 颜色：any-color-goes-here ＆＃34;）并将样式更改为＆＃34; 风格= colorFunct（selectedColor [$指数]）＆＃34;看看是否有效。

HTH，问候。

ng-style不起作用

2 个答案: