javascriptangularjsangularjs-ng-repeatangularjs-ng-show

How to show another text value insteadof showing of existing from ng-repeat for one property using angularjs?


I have data:

html:

<div ng-controller="MainCtrl">
    <ul>
        <li ng-repeat="item in demo">
          {{item.text}}
        </li>
    </ul>
</div>

js:

angular.module('MyApp', [])
    .controller('MainCtrl', [function ($scope) {
    $scope.demo=[
                {"id":"ABC", "name":"ABC","text":"ABC"},
                {"id":"PQR","name":"PQR","text":"PQR"},
                {"id":"XYZ","name":"XYZ","text":"XYZ"}
                ];
    }]);

I want to display the output like below on html view page:

instead of showing:

i.e ex: I want to show the text value as: "MNO" instead of "XYZ" on displaying of view page, I don't want to change anything in the variable($scope.demoValues) using angularjs. I am not sure how to develop this. Please help me. Thanks.

Created Fiddle.


Solution

  • If you're simply looking to do a straight text replacement in the view when a particular value is encountered, you could use string.replace as follows:

    <li ng-repeat="item in demo">
        {{ item.text.replace('XYZ', 'MNO') }}
    </li>