Anton Anton - 6 months ago 27
AngularJS Question

remove dot notation from ng-repeat grid

I did a simple plunker that to show my issue. On my page I need to render some properties which I get from api call. This properties have keys 'id' and 'name'.
I need to render all properties except 'id' and for this purposes I'm using angular filter like here

<form style="padding: 15px">
<button class="btn btn-default" ng-click="upload()">Upload</button>
<div class="form-group row">
<div ng-repeat="k in rowKeys | filter: '!id'" ng-model="rowValue">
<label for="rowValue" class="col-sm-2">{{k}}:</label>
<div class=" col-sm-2">
<input class="form-control rowValue" id="rowValue" value="{{rowData[k]}}" />
</div>
</div>
</div>
<button type="submit" class="btn btn-default" ng-if="rowData" ng-disabled="!rowValue">Submit</button>
</form>


but it shows me some keys thru dot notation such

study.name


I was trying to replace it with pure javascript replace, but got an error

replace is not a function


How could I remove '.name' from all keys on my page?

Answer

Well you could create a simple filter

app.filter('hide', function () {
    return function(input, arg) {
        return input.replace(arg, '');
    };
});

And use it in your code like this:

{{k | hide:'.name'}}

Filter could probably use some more error handling.

Demonstration: Plunkr