CODEWITHSUNDEEP
htmlangularjs
SURYA VISWANATHAN
SURYA VISWANATHAN

Reputation: 187

Display two lines in a row

I want the value in the controller to be displayed in two lines of the same column. 

{{ngapp}}.controller("Controller", function($scope, $http, $modalInstance){
    $scope.selected=[];
    $scope.items=[  
        { 
            value:'Impact to Safety, regulatory compliance environment', 
            key:10, 
            color:'red'
        },
        {
            value:'Reliability Impact', 
            key:9, 
            color:'brown'
        }
    ]
});

code in html:

<div class="well form-group" >
    <table class="table" cellspacing="1">
        <tr>
            <th>Rank</th>
            <th>Criteria: Type of loss incurred</th>
        </tr>
        <tr ng-repeat="item in items" onclick="selected.item= item" ng-click="sel(item)">
            <td ng-style="{ 'background-color': item.color }">{{item.key}}</td>
            <td> {{item.value}} </td>
        </tr>
    </table>

    //<label>{{selected.item}}</label>
    {% endverbatim %}
</div>

I want the Value:'Impact to Safety' to be displayed in one line. And 'regulatory compliance environment' in a new line for the same column and the same key. Anybody can help? Thanks. I'm new here.

For other parts of the code, refer to this Question,

Display value in a button by linking two modals

Upvotes: 0

Views: 507

Answers (1)

Bob Brinks
Bob Brinks

Reputation: 1392

You can use https://www.npmjs.com/package/angularjs-filters to do this.

Replace the ',' by '<br />' and it should appear on the next line.

{{item.value |  string.replace : ',': '<br />'}}

Upvotes: 1

Related Questions