我想添加到ng-grid的链接。
这是我的代码供您参考
这是我的代码供您参考
<html ng-app="myApp">
<head lang="en">
<Meta charset="utf-8">
<title>Getting Started With ngGrid Example</title>
<link href="../../Content/ng-grid.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.20.js" type="text/javascript"></script>
<script src="../../Scripts/angular.js" type="text/javascript"></script>
<script src="../../Scripts/ng-grid.js" type="text/javascript"></script>
<script src="../../Scripts/main.js" type="text/javascript"></script>
<script type="text/javascript">
var app = angular.module('myApp',['ngGrid']);
app.controller('MyCtrl',function ($scope) {
$scope.myData = [{ name: "RK.PRABAKAR",age: 25,href: "<a href='#'>Link1</a>" },{ name: "Yoga",age: 27,{ name: "James",{ name: "Siva",age: 35,{ name: "KK",href: "<a href='#'>Link1</a>"}];
$scope.pagingOptions = {
pageSizes: [2,4,6],pageSize: 2,currentPage: 1
};
$scope.gridOptions = {
data: 'myData',enablePaging: true,showFooter: true,enableCellSelection: true,enableRowSelection: false,enablePinning: true,pagingOptions: $scope.pagingOptions,enableCellEdit: true,columnDefs: [{ field: 'name',displayName: 'Name',enableCellEdit: true },{ field: 'age',displayName: 'Age',{ field: 'href',displayName: 'Link',enableCellEdit: false }]
};
});
</script>
<style>
.gridStyle {
border: 1px solid rgb(212,212,212);
width: 500px;
height: 300px;
}
</style>
</head>
<body data-ng-controller="MyCtrl">
<div class="gridStyle" data-ng-grid="gridOptions"></div>
</body>
现在数据网格工作正常，除了网格中的href链接。
链接没有呈现为html标签，它显示为普通字符串。
我想从myData添加ng-grid的链接
更新：
原文链接：https://www.f2er.com/angularjs/144559.html已经注意到，这个答案不适用于ui-grid。这是可以理解的，因为在答案时只有ng-grid存在;然而，{{COL_FIELD}}代替{{row.getProperty(col.field)}})可以使解决方案对于ng-grid和ui-grid都有效。
我知道在这些情况下，我在写这个答案的时候使用了COL_FIELD，所以我不知道用更长的row.getProperty(col.field)来回答的理由…但是无论如何，使用COL_FIELD，你应该很好用ng-grid和ui-grid。
原创(未更改)答案：
您只需要为链接字段定义单元格模板…
你可以这样做：
{
field: 'href',enableCellEdit: false,cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><a href="{{row.getProperty(col.field)}}">Visible text</a></div>'
}
或者你可以使用一个变量来做到这一点(以保持你的gridOptions有点清洁：
var linkCellTemplate = '<div class="ngCellText" ng-class="col.colIndex()">' +
' <a href="{{row.getProperty(col.field)}}">Visible text</a>' +
'</div>';
{
field: 'href',cellTemplate: linkCellTemplate
}
或者您甚至可以将模板放在外部HTML文件中，并指向该URL：
{
field: 'href',cellTemplate: 'linkCellTemplate.html'
}
…并且您只需要将URL作为href存储在myData中以使用此解决方案:)
