我正在使用 Angular-bootstrap。我使用 ng-repeat 来绑定(bind)对象数组。 (请参阅下面的代码)。
当我弹出复选框时，我想显示字典值，而不是键。知道如何做到这一点吗？提前感谢您的帮助!
PS:我明白，我也可以将字典值设置为列表中对象的一部分(例如 { Id: 5,Checked: true, Name:'C#' })，但请原谅我有无法控制从源返回的数据。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html ng-app="mlApp">
<head runat="server">
<title></title>
<link href="bower_components/bootstrap-css-only/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js" type="text/javascript"></script>
<script>
angular.module('mlApp', ['ui.bootstrap'])
.controller('mlCtrl', [function () {
var self = this;
self.lists = [{ Id: 5, checked: true }, { Id: 6, checked: false }, { Id: 8, checked: true }, { Id: 9, checked: true }, { Id: 11, checked: false}];
// implement a dictionary here for the pop over to call
self.dictList = [{ key: 5, value: 'C#' }, { key: 6, value: 'Javascript' }, { key: 8, value: 'Angular' }, { key: 9, value: 'T-SQL' }, { key: 11, value: 'Linq'}];
} ]);
</script>
</head>
<body>
<form id="form1" runat="server">
<div ng-controller="mlCtrl as mCtrl">
<ul>
<li ng-repeat="m in mCtrl.lists"><input type="checkbox" popover="{{ mCtrl.dictList[$index].value }}" popover-trigger="mouseenter" ng-model="m.checked" ng-checked="m.checked" />{{m.Id}}</li>
</ul>
</div>
</form>
</body>
</html>
最佳答案
问题是 m.Id 不是项目的索引，而是它的属性
如果这是你真正想要实现的目标，我会说
{{ mCtrl.dictList[$index] }}
或者创建一个作用域函数，根据键从 dictList 中搜索字典项
关于javascript - 如何让 Angular-bootstrap 弹出窗口显示字典值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28119914/