Text angular doesnt load the cell borders in angularjs

Question

I would like to be able to display a table with cell borders in a text angular div.

The content renders but the cell border doesnt

markup

<div ng-app="test">
    <div ng-controller="testController">
        <div text-angular name="testEditor" ng-model="htmlContent"></div>
    </div>
</div>

controller code

angular.module('test', ['textAngular'])

.controller('testController',

function($scope, $timeout, textAngularManager) {
    $scope.htmlContent = undefined;
    //$scope.htmlContent = '<p>Hello There!</p>';

    $timeout(function () {
        $scope.htmlContent = "<table><tr><td style ='border: 1px solid black'>aaaa</td><td style ='border: 1px solid black'>dddddd</td></tr><tr><td style ='border: 1px solid black'>fffff</td><td style ='border: 1px solid black'>ffffffff</td></tr></table>";
        //textAngularManager.refreshEditor('testEditor');
    }, 1000);

});

This is demonstrated at -> http://jsfiddle.net/x20mfq44/

However if i render the html in a separate jsfiddle without text angular, the cell borders show up fine.

<table>
<tr>
    <td style ='border: 1px solid black'>aaaa</td>
    <td style ='border: 1px solid black'>dddddd</td>
</tr>
<tr>
    <td style ='border: 1px solid black'>fffff</td>
    <td style ='border: 1px solid black'>ffffffff</td>
</tr>
</table>

https://jsfiddle.net/1xhfLpmq/

Are you using angular-sanitize? That can mess with HTML attrs through ng-model — fos.alex, Oct 21 '15 at 18:35
Please add that as an answer. Ill add the corrected jsfiddle — Jay Jay Jay, Oct 21 '15 at 18:40

score 1 · Accepted Answer · answered Oct 21 '15 at 18:43

1

Are you using angular-sanitize? That can mess with HTML attrs through ng-model.

answered Oct 21 '15 at 18:43

fos.alex

5,317
4
16
18

score 0 · Answer 2 · answered Oct 21 '15 at 18:44

A rule of thumb - don't use inline styling in your html. It's messy and outdated. A simple css rule can solve your problem, something like

table td {border: 1px solid black}

I updated your fiddle, here : http://jsfiddle.net/x20mfq44/1/

Hope this helps!

Text angular doesnt load the cell borders in angularjs

2 Answers2