Question

这是我的代码

＆＃13;

// Code goes here

var app = angular.module('app', ['ui.grid']);

app.controller('MainCtrl', ['$scope', '$log', function ($scope, $log) {


 $scope.gridOptions = {};

   $scope.gridOptions.columnDefs = [
         { name: 'firstName',cellTemplate:'<a ng-model=firstName></a>'},
         { name: 'lastName'},
         { name: 'Hyperlink',
             cellTemplate:'<div>' +
                       '  <a href="http://stackoverflow.com">Click me</a>' +
                       '</div>' }
       ];

 $scope.gridOptions.data = [
    {
        "firstName": "Cox",
        "lastName": "Carney",
        "company": "Enormo",
        "employed": true
    },
    {
        "firstName": "Lorraine",
        "lastName": "Wise",
        "company": "Comveyer",
        "employed": false
    },
    {
        "firstName": "Nancy",
        "lastName": "Waters",
        "company": "Fuelton",
        "employed": false
    }
];
}]);

＆＃13;

<!doctype html>
<html ng-app="app">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-animate.js"></script>
    <script src="http://ui-grid.info/release/ui-grid-unstable.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid-unstable.css" type="text/css">
    <link rel="stylesheet" href="main.css" type="text/css">
  </head>
  <body>

<div ng-controller="MainCtrl">
  <div ui-grid="gridOptions" class="grid"></div>
</div>


    <script src="script.js"></script>
  </body>
</html>

＆＃13;

这是我的傻瓜： - http://plnkr.co/edit/WFSbpkYv91af3uAbBnIp?p=preview

在上面的代码中显示没有链接格式的firstname。但是我想以链接格式显示第一个列数据。

Answer 1

以下是将显示名称

的cellTemplate示例

cellTemplate:'<a href="http://stackoverflow.com">{{ row.entity.firstName }}</a>'

http://plnkr.co/edit/F5PS4nCzLkywnSzazMNx

此致埃里克

如何使用角度ui-grid动态显示数据以链接标签？

1 个答案: