Smartadmin，未绑定数据项子元素(AngularJS)

Question

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

我提取了datatable (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();
        });