Still fairly new to angular and am seeing some weird behavior from doing an ng-repeat.
When I run the following code, I get 1410 rows back rendered as part of the repeat. I only have 5 rows coming back from the search. None of the data-binding works. No idea where I’m getting the extra 1405 rows wither. I have no idea why Angular seems to be inserting 1405 rows though I assume it's something obvious I'm just overlooking.
UPDATE The reason I'm getting ~1400 rows back is because the ng-repeat is treating $scope.results as if it were a string so it's giving me a row per char. Still not sure why it's doing that however.
I have the following code:
<table class="table">
<thead>
<tr class="filters">
<th class="filter-col">Preview</th>
<th class="filter-col">Content Id</th>
<th class="filter-col">Doc Type</th>
<th class="filter-col">Account Number</th>
<th class="filter-col">End Date</th>
</tr>
</thead>
<tbody >
<tr ng-repeat="row in results track by $index">
<td><a href="">View</a></td>
<td>{{row.document_Id}}</td>
<td>{{row.document_type_2}} + "\" + {{row.document_type_3}} + "\" + {{row.document_type_4}} + "\" + {{row.document_type_5}}</td>
<td>{{row.account_number}}</td>
<td>{{row.end_datee}}</td>
</tr>
</tbody>
</table>
I have the following data in scope
results: [
{
"document_Id": 66539,
"document_type_2": "Deposit",
"document_type_3": "Deposit Documents",
"document_type_4": "Deposit Documents",
"document_type_5": "Photo ID",
"end_date": "2008-01-07T00:00:00",
"account_number": 57860.0
},
{
"document_Id": 66536,
"document_type_2": "Deposit",
"document_type_3": "Deposit Documents",
"document_type_4": "Deposit Documents",
"document_type_5": "W-9 Request for Taxpayer ID",
"end_date": "2008-01-07T00:00:00",
"account_number": 57860.0
},
{
"document_Id": 66530,
"document_type_2": "Deposit",
"document_type_3": "Signature Cards",
"document_type_4": "Signature Cards",
"document_type_5": "Signature Card-Single",
"end_date": "2008-01-07T00:00:00",
"account_number": 57860.0
},
{
"document_Id": 66523,
"document_type_2": "Deposit",
"document_type_3": "Deposit Documents",
"document_type_4": "Deposit Documents",
"document_type_5": "ATM Card Request",
"end_date": "2008-01-07T00:00:00",
"account_number": 57860.0
},
{
"document_Id": 66522,
"document_type_2": "Deposit",
"document_type_3": "Deposit Documents",
"document_type_4": "Deposit Documents",
"document_type_5": "Boarding Data Account Summary",
"end_date": "2008-01-07T00:00:00",
"account_number": 57860.0
}
]
UPDATE: Here's the controller:
app.controller('SearchController', function ($scope, $http, LoginStateService, TokenStateService) { $scope.stateService = LoginStateService; $scope.tokenService = TokenStateService;
//Search Types
$scope.searchTypes = [{ text: "Documents", value: "document" }, { text: "Items", value: "item" }, { text: "Reports", value: "report" }, { text: "Statements", value: "statement" }];
$scope.selectedSearchType = $scope.searchTypes[0];
//Search Terms
$scope.searchTerms = [{ text: "Account Number", value: "account_number_f" }, { text: "Amount", value: "amount" }, { text: "Doc Type Path", value: "document_type_path" }, { text: "Date", value: "end_date" }, ]
$scope.selectedSearchTerm = $scope.searchTerms[0];
//Rows to Return
$scope.rowsPerPage = [{ text: "5", value: 5 }, { text: "10", value: 10 }, { text: "15", value: 15 }, { text: "20", value: 20 }, { text: "40", value: 40 }, ];
$scope.selectedRowsPerPage = $scope.rowsPerPage[3];
$scope.showSearchResults = false;
this.logoImage = "images/ActiveView_ContentMgm_140x40.png";
this.doSearch = function ()
{
var loginUrl = "http://ten1.com/services/rest/demoservice.svc/Search";
delete $http.defaults.headers.common['X-Requested-With'];
$http({
method: 'GET', url: loginUrl, params: {
authenticationToken: $scope.tokenService.getAuthenticationToken(), searchType: $scope.selectedSearchType.value,
searchTerm: $scope.selectedSearchTerm.value, searchValue: this.searchValue, rowsToReturn: $scope.selectedRowsPerPage.value
}
})
.success(function (data, status, headers, config)
{
$scope.status = status;
$scope.results = JSON.parse(data);
//$scope.gridOptions = { data: 'results' };
$scope.showSearchResults = true;
})
.error(function (data, status, headers, config)
{
$scope.results = data || "Search Request failed";
$scope.status = status;
alert("Search Request Failed");
});
};
});
