Smartadmin，数据表子元素未绑定（AngularJS）

Question

我从 (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);

非常感谢任何帮助！

Answer 1

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

childScope.$apply(function() {
          childScope.d = row.data();
        });