Javascript 更改角度待办事项列表中的颜色
嗨,这是我第一次来这里,所以请耐心等待我,我有一个问题 我需要在span类中更改颜色这是我的代码 当我单击复选框时,颜色需要在单击事件中从somecolor更改为灰色 另外,如果有人想帮助我,我会尝试用所选的选项进行选择,但要有角度 帮助者的tnx 函数TodoCtrl($scope){ $scope.priority=['emergency'、'Critical'、'Normal'、'if oucan'] $scope.todos=[{ 文字:“参加评选日”, 完成:错误, lvl:‘关键’ }, { 文本:“注册到完整的网络课程”, 完成:错误, lvl:“正常” }, { 文字:“去看X战警启示录电影”, 完成:错误, lvl:“如果你能” }]; $scope.addTodo=函数(){ $scope.todos.push({ text:$scope.todoText, 完成:错误, lvl:$scope.todoLvl }); $scope.todoText=''; }; $scope.remaining=函数(){ var计数=0; angular.forEach($scope.todos,function(todo){ 计数+=todo.done?0:1; }); 返回计数; }; $scope.archive=函数(){ var oldTodos=$scope.todos; $scope.todos=[]; 角度.forEach(oldTodos,function(todo){ 如果(!todo.done)$scope.todos.push(todo); }); }; }Javascript 更改角度待办事项列表中的颜色,javascript,html,css,angularjs,Javascript,Html,Css,Angularjs,嗨,这是我第一次来这里,所以请耐心等待我,我有一个问题 我需要在span类中更改颜色这是我的代码 当我单击复选框时,颜色需要在单击事件中从somecolor更改为灰色 另外,如果有人想帮助我,我会尝试用所选的选项进行选择,但要有角度 帮助者的tnx 函数TodoCtrl($scope){ $scope.priority=['emergency'、'Critical'、'Normal'、'if oucan'] $scope.todos=[{ 文字:“参加评选日”, 完成:错误, lvl:‘关键’
.todo true{
文字装饰:线条贯通;
颜色:灰色;
}
1.todo紧急{
颜色:红色;
}
.todo Critical{
颜色:橙色;
}
.托多正常{
颜色:绿色;
}
.如果你能{
颜色:皇家蓝;
}
副车架{
位置:绝对位置;
保证金:10px 0px 0px 50px;
}
待办事务处{
高度:20px;
}
待办事项
{{item}}
添加
剩余{todos.length}}中的{restining()}}
{{todo.text}{{todo.lvl}}
您可以根据您的todo.done(ng模型)为添加“ng类”
还可以为颜色添加更具体的选择器
函数TodoCtrl($scope){
$scope.priority=['emergency'、'Critical'、'Normal'、'if oucan']
$scope.todos=[{
文字:“参加评选日”,
完成:错误,
lvl:‘关键’
}, {
文本:“注册到完整的网络课程”,
完成:错误,
lvl:“正常”
}, {
文字:“去看X战警启示录电影”,
完成:错误,
lvl:“如果你能”
}];
$scope.addTodo=函数(){
$scope.todos.push({
text:$scope.todoText,
完成:错误,
lvl:$scope.todoLvl
});
$scope.todoText='';
};
$scope.remaining=函数(){
var计数=0;
angular.forEach($scope.todos,function(todo){
计数+=todo.done?0:1;
});
返回计数;
};
$scope.archive=函数(){
var oldTodos=$scope.todos;
$scope.todos=[];
角度.forEach(oldTodos,function(todo){
如果(!todo.done)$scope.todos.push(todo);
});
};
}
span.todo-true{
文字装饰:线条贯通;
颜色:灰色;
}
1.todo紧急{
颜色:红色;
}
.todo Critical{
颜色:橙色;
}
.托多正常{
颜色:绿色;
}
.如果你能{
颜色:皇家蓝;
}
副车架{
位置:绝对位置;
保证金:10px 0px 0px 50px;
}
待办事务处{
高度:20px;
}
待办事项
{{item}}
添加
剩余{todos.length}}中的{restining()}}
{{todo.text}{{todo.lvl}}
你的问题很好!阅读相关内容后,您还可以使用此指令代替todo-{{{todo.lvl}
=>ng class=“{'todo-Critical':todo.lvl=='Critical','todo-Normal':todo.lvl=='Normal'}”
。它使您可以控制何时需要根据应用程序中定义的规则在不同类之间切换NIV,如果我的回答有帮助,请将其标记为“V”,或者让我知道什么仍然不适合您。tnx感谢您的帮助(: