0

I tried to pass the link title attribute for "Tags".

The Tag value should be an array now I am tried to remove double quotes on link title attribute.

When I hover currently I am getting :-["text", "text 1", "text 2"].

But expected format (Text Capitalized Case):- [Text, Text 1, Text 2]

HTML:

<div class="" ng-controller="myCrtl">
    <span>Heading Documents</span>
    <ul ng-repeat="list in names">
        <li ng-repeat="lists in list.bookmarks">
            <a href="{{lists.link}}" data-toggle="tooltip" data-placement="right" title="{{lists.tags}}">{{lists.title}}</a>
        </li>
    </ul>
</div>

JS File:

var app=angular.module('MyApp',[]);

app.controller('myCrtl',["$scope",function($scope){
    $scope.names=[{
        "description": "Testing File",
        "totalCount": 6,
        "bookmarks": [{
                "title": "Google",
                "link": "https://www.google.co.in",
                "tags": [
                    "text", "text 1", "text 2"
                ]
            },

            {
                "title": "Test Construction1",
                "link": "http://google.com",

                "tags": [
                    "content", "content 2", "content 3"
                ]
            },
             {
            "title": "Test Connection",
            "link": "https://www.google.com",
            "tags": [
                "message", "message 1"
            ]
        }
        ]

    }];
}]);
Thomas Bormans
  • 5,156
  • 6
  • 34
  • 51
CodeMan
  • 1,941
  • 6
  • 26
  • 44

1 Answers1

1

The reason you're getting ["text", "text 1", "text 2"] is because you're displaying an array with string in it; if you want a string that looks like [Text, Text 1, Text 2] then you can pipe the output through a function:

  $scope.change = function(a){
     a = a.map(function(x){
        return x.replace(/^[a-z]/,function(m){
            return  m.toUpperCase()
        });
     });
    return "["+a.join()+"]";
  };

and in your view you just use it like:

<ul ng-repeat="list in names">                                  
<li ng-repeat="lists in list.bookmarks">
  <a href="{{lists.link}}" data-toggle="tooltip" data-placement="right" title="{{change(lists.tags)}}">{{lists.title}}</a></li>

</ul>

jsbin


you could also use angular filters to do it, but in the end the concept is : filter the data to obtain a modified output.

maioman
  • 18,154
  • 4
  • 36
  • 42