我有多个按钮可以更改文本颜色的 CSS 属性。我可以使用诸如“蓝色”或“红色”之类的静态值来实现此功能,但我想访问保存在我的 Controller 中的对象中的十六进制代码值。
<body ng-app="MyApp" ng-controller="AppCtrl">
<input type="button" value="blue" ng-style="{color: 'blue'}"
ng-click="myColor = { color:'blue' }">
<div ng-repeat="person in people" ng-style="myColor">
Name: {{ person.name }} <br>
Birth Year: {{ person.birth }}<p>
</div>
</body
这是我的 Controller
var app = angular.module('MyApp', []);
app.controller('AppCtrl', function($scope) {
$scope.colors = [
{ color: 'b1', value: '#000000' }, //black
{ color: 'b2', value: '#000099' }, //blue
{ color: 'r1', value: 'ff0000' }, //red
{ color: 'y1', value: '#ffff00' } //yellow
];
$scope.people = [
{ name: 'Abraham Lincoln', birth: '1809' },
{ name: 'Benjamin Franklin', birth: '1706' },
{ name: 'George Washington', birth: '1732' }
];
})
我要改变
ng-click="myColor = { color:'blue' }"
按照
的思路ng-click="myColor = { color:'colors[1].value' }
最佳答案
您可以通过在 ng-style
上调用函数来调用它
<div ng-repeat="person in people" ng-click="person.color = colors[$index].color" ng-style="{color: person.color}">
Name: {{ person.name }} <br>
Birth Year: {{ person.birth }}<p>
</div>
Not sure which color should be binding to which
person
, so I took color based on index
关于javascript - AngularJS 通过 ng-click 绑定(bind) CSS 值。值位于 Controller 中的对象中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34863104/