我刚刚创建了一个在角度javascript中编辑html表格元素的函数
$scope.divider = function () {
var table = document.getElementById("table1");
var finalpos = "";
var div = "";
var divs = "";
var finals = "";
for (var i = 0; i < $scope.tasks.length; i++) {
divs = "";
for (var x = 0; x < $scope.columns.length; x++) {
var tds = table.getElementsByTagName("td")[x].innerHTML;
var pos1 = tds.search('<div');
var pos2 = tds.search('</div>');
if (pos1 == -1 || pos2 == -1) {
pos1 = tds.search('<!-- ng');
pos2 = tds.search('s -->');
div = tds.substr(pos1, pos2 - pos1 + 5);
var c1 = tds.substr(0, pos1 - 1);
var c2 = tds.substr(pos2 + 5, tds.length);
} else {
div = tds.substr(pos1, pos2 - pos1 + 6);
var c1 = tds.substr(0, pos1 - 1);
var c2 = tds.substr(pos2 + 6, tds.length);
}
finalpos = c1 + c2;
table.getElementsByTagName("td")[x].innerHTML = finalpos;
div = ' <td ng-repeat="c in columns"> ' + div + ' </td> ';
divs = divs.concat(div);
}
divs = ' <tr > ' + divs + ' </tr> ';
console.log(divs);
finals = finals + divs;
}
table.getElementsByTagName("tr")[1].outerHTML = finals;
//console.log($scope.tasks);
}
之后所有角度函数都停止工作(忽略)。
编辑后的这个html代码:
<tr>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">asdasdsa</h4>
</div>
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">nfnfhgfh</h4>
</div>
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">zzncvbzxnbn</h4>
</div>
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">zxhkcjhzxkjch</h4>
</div>
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">mdf,n,mdfn</h4>
</div>
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">werew</h4>
</div>
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngRepeat: t in tasks track by $index -->
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">nbb bv</h4>
</div>
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">وليد 32324</h4>
</div>
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngRepeat: t in tasks track by $index -->
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
<h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">sjkcsjkh</h4>
</div>
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngRepeat: t in tasks track by $index -->
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
</tr>
<tr>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus --
<!-- end ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
<!-- ngIf: c.columnid == t.transstatus -->
</td>
</tr>
之后,ng-click和其他功能停止工作。