这是我的问题:
我正在尝试构建一个 Angular Directive(指令),它将在内部使用 ng-table
。
问题是输入参数 tableData
最初被初始化为一个空数组,因为它是在用户单击按钮时从指令外部设置的。
所以我在 tableData
上添加了一个 watch ,并尝试在 tableData
更改时重新加载表格。
但是 differ.resolve 函数以以下异常结束。
请帮忙
指令用法
<table-multiselect table-data="objectArray"></table-multiselect>
这是我的温度
TableMultiselect.tmpl.cshtml
<table ng-table="multiselect" class="table">
<tr ng-repeat="feature in $data">
<td data-title="'Id'" sortable="'id'">{{feature .id}}</td>
<td data-title="'Name'" sortable="'name'">{{feature .name}}</td>
<td data-title="'Type'" sortable="'type'">{{feature .type}}</td>
</tr>
</table>
Controller
.directive('TableMultiselect', function (ngTableParams) {
return {
restrict: 'E',
templateUrl: 'TableMultiselect.tmpl.cshtml',
scope: {
tableData: '='
},
controller: function ($scope) {
var buildMultiSelectTable = function () {
return new ngTableParams({
page: 1,
count: 10,
sorting: {
id: 'asc'
},
filter: {},
}, {
counts: [10],
total: $scope.tableData.length, // length of data
getData: function ($defer, params) {
var data = $scope.tableData;
if (data.length <= 10) {
params.settings({ 'counts': [] });
}
params.total(data.length);
$defer.resolve(data);
}
});
};
$scope.multiselect = buildMultiSelectTable();
$scope.$watch('tableData', function (newValue, oldValue) {
if ($scope.tableData != undefined && $scope.tableData.length > 0) {
$scope.multiselect.reload();
}
});
},
};
});
错误
TypeError: Cannot set property '$data' of null
at angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:3095
at l.promise.then.J (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:101)
at angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:102
at h.a.$get.h.$eval (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:113)
at h.a.$get.h.$digest (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:110)
at h.a.$get.h.$apply (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:113)
at m (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:72)
at w (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:77)
at XMLHttpRequest.B.onreadystatechange (angular?v=M5FbIdPbFPNnbg6slbXZa4DR7EKc6tL5nLLGAVGYAa41:79)
最佳答案
从您粘贴的代码中可以明显看出一个问题是指令名称应该是“tableMultiSelect”而不是“TableMultiSelect”
app.directive('tableMultiselect', function (ngTableParams) {
如果不查看完整代码,可能还有其他问题很难猜测,所以这里是基于我从你的问题中理解的工作实现:http://plnkr.co/edit/7MHhl6AKdfzajprfc0xK?p=preview
这就是您的对象数组在运行时的变化方式。
app.controller('AppCtrl',function($scope,$timeout){
$scope.objectArray = [];
$timeout(function(){
$scope.objectArray.push({
id: 1,
name : "Abc",
type : "type1"
});
},2000);
});
关于javascript - 自定义指令中的 ng-table 错误 "Cannot set property ' $data' of null",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33155313/