Hello there! I'm currently working on rendering a form based on an API call. Using a couple of filters, I am able to hide all elements that have 'id' in the title and which equal 0. However, I do need to display the initial element Id. I thought about using '$first', but since the first element is a checkbox value, I'm not sure how to proceed. Any help would be greatly appreciated. Check out the applied plunk for reference.
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, $http) {
$scope.upload = function (){
$scope.rowKeys = Object.keys($scope.rowData);
};
});
app.filter('hide', function () {
return function(input, arg) {
return input.replace(arg, '');
};
})
Here's the HTML snippet:
<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' | filter: '!0'" ng-model="rowValue">
<label for="rowValue" class="col-sm-2">{{k | hide:'.name'}}:</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>