0

我从 (wrapbootstrap.com/theme/smartadmin-responsive-webapp-WB0573SK0) 购买了 smartadmin,并使用 1.5 版本的 angular。

我提取了数据表(wrapbootstrap.com/preview/WB0573SK0)并将其放入我自己的项目中。到目前为止,它可以工作,除非我单击该行并打开子元素,那里的数据没有绑定。

当我使用 Angular Chrome 插件检查范围时,我可以在您的版本以及我的项目中看到范围具有实际数据,但不知何故 ng-bing 无法正常工作。(如您在屏幕截图中所见)

我的项目 - 空子元素 http://s14.directupload.net/images/141120/f9xzm3ab.png

它应该是什么样子 http://fs1.directupload.net/images/141120/2pp3icxa.png

风景:

<caption class="smart-datatable-child-format" data-child-control="td.details-control">
                  <table cellpadding="5" cellspacing="0" border="0"
                         class="table table-hover table-condensed">
                    <tr>
                      <td style="width:100px">Project Title:</td>
                      <td ng-bind-html="d.name"></td>
                    </tr>
                    <tr>
                      <td>Deadline:</td>
                      <td ng-bind-html="d.ends"></td>
                    </tr>
                    <tr>
                      <td>Extra info:</td>
                      <td>And any further details here (images etc)...</td>
                    </tr>
                    <tr>
                      <td>Comments:</td>
                      <td ng-bind-html="d.comments"></td>
                    </tr>
                    <tr>
                      <td>Action:</td>
                      <td ng-bind-html="d.action"></td>
                    </tr>
                  </table>
                </caption>

控制器:

  $scope.projects = [
{
  "name": "name",
  "est": "est",
  "contacts": "contacts",
  "status": "status",
  "target-actual": "target-actual",
  "actual": "actual",
  "tracker": "tracker",
  "starts": "01-21-2013",
  "ends": "<strong>03-15-2015</strong>",
  "comments": "comments",
  "action": "actions"
}];


$scope.tableOptions = {
"data": $scope.projects,
"iDisplayLength": 15,
"columns": [
  {
    "class": 'details-control',
    "orderable": false,
    "data": null,
    "defaultContent": ''
  },
  {"data": "name"},
  {"data": "est"},
  {"data": "contacts"},
  {"data": "status"},
  {"data": "target-actual"},
  {"data": "starts"},
  {"data": "ends"},
  {"data": "tracker"}
],
"order": [[1, 'asc']]};

指令:(在点击处理程序上)

if (attributes.tableOptions) {
    console.log("extending angular tableOptions");
    options = angular.extend(options, scope.tableOptions)
  }

  var _dataTable;

  var childFormat = element.find('.smart-datatable-child-format');
  if (childFormat.length) {
    var childFormatTemplate = childFormat.remove().html();
    element.on('click', childFormat.data('childControl'), function () {
      var tr = $(this).closest('tr');

      var row = _dataTable.row(tr);
      if (row.child.isShown()) {
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
      }
      else {
        // Open this row
        var childScope = scope.$new();
        childScope.d = row.data();
        var html = $compile(childFormatTemplate)(childScope);
        row.child(html).show();
        tr.addClass('shown');
      }
    })
  }

  _dataTable = element.DataTable(options);

非常感谢任何帮助!

4

1 回答 1

0

我必须在指令中应用范围。$compile 还不够。

childScope.$apply(function() {
          childScope.d = row.data();
        });
于 2014-11-20T20:06:42.427 回答