Refer the below code, I am getting
0: {status: "DRAFT", $$hashKey: "object:282"}
1: {status: "SUBMITTED", $$hashKey: "object:283"}
2: {status: "APPROVED", $$hashKey: "object:284"}
3: {status: "REJECTED", $$hashKey: "object:285"}
4: {status: "RESUBMIT", $$hashKey: "object:286"}
5: {status: "APPROVAL_NR", $$hashKey: "object:287"}
length: 6
__proto__: Array(0)
as a response in "statusdata", I am using ng-repeat to display these data as a dropdown. I want to rename the last "approval_nr" in the view.
From angular docs: https://docs.angularjs.org/api/ng/directive/ngRepeat
You can use $last.
$last boolean true if the repeated element is last in the iterator.
You can also check this one: Different class for the last element in ng-repeat.
I would implement it like the following:
function renameIfLast(name, isLast) {
if (isLast) {
return name.toUpperCase(); // do you rename logic here <<
} else {
return name;
}
}
<h1 ng-repeat="x in records">{{renameIfLast(x.status, $last)}}</h1>
Related
Im trying to find in Object 2 if _type matches with filterByCallTypeTitulo in Object 1 and if so make a new array with each match with the information inside Object 2.
I have tried using the filter() method and forEach but its not working for me (most likely im doing it wrong).
Example of what I have tried:
callDataList.filter(value => value.type === filters.voiceFilterViewModel.filterByCallTypeTitulo);
Object 1 (filters.voiceFilterViewModel):
VoiceFilterViewModel {_filterByDateTime: "Duración", _filterByAscDesc: "Descendente", _arrayCallType: Array(1), _filterByCallTypeTitulo: "Internacionales"}
arrayCallType: Array(1)
0: VoiceFilterItemViewModel
callTypes: null
titulo: "Internacionales"
_callTypes: null
_titulo: "Internacionales"
__proto__: Object
length: 1
__proto__: Array(0)
filterByAscDesc: "Descendente"
filterByCallTypeTitulo: "Internacionales"
filterByDateTime: "Duración"
__proto__: Object
Object 2 (callDataList):
0: DetailedUsageVoiceModel {_duration: 601, _cost: 0, _type: "Móvil Nacional", _usageDate: Moment, _usageType: "VOZ", …}
1: DetailedUsageVoiceModel {_duration: 79, _cost: 0, _type: "Móvil Nacional", _usageDate: Moment, _usageType: "VOZ", …}
2: DetailedUsageVoiceModel {_duration: 1314, _cost: 0, _type: "Numeración corta", _usageDate: Moment, _usageType: "VOZ", …}
Detail Object 2:
0: DetailedUsageVoiceModel
calledNumber: (...)
origin: (...)
startDate: (...)
trafficType: (...)
type: "Móvil Nacional"
Your attempt seems right but incomplete to me.
You are filtering the array which will return you an array of matched items.
Next you can run an iteration on the filtered items and make a new array based on it.
I'm not sure if this is exactly what you're seeking but here is my attempt.
const matchedItems = callDataList.filter(value => value.type === filters.voiceFilterViewModel.filterByCallTypeTitulo);
const newArr = matchedItems.reduce((accumulator, item) => {
accumulator.push({
"key1": filters.voiceFilterViewModel.titulo,
"key2": filters.voiceFilterViewModel. filterByAscDesc
});
return acc;
}, []);
You can read more about Array.reduce and accumulator at mdn
Hope it helps!!
"I'm adding a property on array while in a forEach loop. But when I do the console.log() the added value on each array is always the last value of the foreach loop."
deliveries data has location and I want to pass the location to pickupDetails.
deliveries: [{ //data of deliveries that I want to pass in pickupDetails
0: {Location: Korea},
1: {Location: Japan}
}]
let pickupDetails = this.state.pickupDetails;
//pickupDetails is only one object then It will become two since the deliveries has 2 objects
pickupDetails = {
name: "June"
}
this.state.deliveries.forEach((delivery, index) => {
pickupDetails.location = delivery.location;
console.log(pickupDetails)
})
the result of the console:
pickupDetails = {
name: "June"
location: "Japan" //this should be Korea since the first loop data is korea
}
pickupDetails = {
name: "June"
index: "Japan"
}
I think something missing from that code maybe because its dummy data. alright from my point of view you confused with javascript reference.
deliveries: [{ //data of deliveries that I want to pass in pickupDetails
0: {Location: Korea},
1: {Location: Japan}
}]
let pickupDetails = this.state.pickupDetails;
this.state.deliveries.forEach((delivery, index) => {
let newPickupDetails = JSON.parse(JSON.stringify(pickupDetails));
newPickupDetails.location = delivery.location;
console.log(newPickupDetails);
})
the result of the console:
pickupDetails = {
name: "Juan"
location: "Japan" //this should be Korea since the first loop data is korea
}
pickupDetails = {
name: "June"
index: "Japan"
}
JSON.parse and JSON.stringify we use for create new object instead of use reference. console log effected because it linked by reference so if you make it new object it will do.
Check variable newPickupDetails
I am working on export into excel sheet requirement using 'alasql'.
My Javasript object to be given as input to alasql is
0:
ContactEmail: "email1#example.com"
ContactName: "abcd"
CustomerName: "defg"
SubdomainName: "adasdasd"
1:
ContactEmail: "email2#example.com"
ContactName: "abcd"
CustomerName: "defg"
SubdomainName: "adasdasd"
2:
ContactEmail: "email3#example.com"
ContactName: "abcd"
CustomerName: "defg"
SubdomainName: "adasdasd"
below is my alasql script to export into excel sheet
var sheet_name = 'clients.xlsx'
alasql('SELECT * INTO XLSX("'+sheet_name+'",{headers:true}) FROM ?', arrayToExport);
My probem here is, it is exporting only the first key that is '0' & '1' key values and headers like below:
0 1
CustomerName name1
ContactName contact1
ContactEmail email1#example.com
SubdomainName adasdasd
JS Includes:
<script src="{{ asset(auto_version('public/js/alasql.min.js')) }}"></script>
<script src="{{ asset(auto_version('public/js/alasql_xlsx.js')) }}"></script>
Can anyone please assist me in this. Thanks.
I have fixed this issue. I hope this may be helpful for others. I have fixed it as first I have tried by giving directly a javascript object which is not the right way so, I have converted the javascript object to array and then object, also the array should be in a key:value pair for each array-object iteration. I think you may be confused little bit but after watching it you will get clarity. My array-object is like below:
arrayToExport:
[Array(11)]
0: Array(11)
0: {CustomerName: "CName1", ContactName: "contact1", ContactEmail: "email1#example.com", SubdomainName: "domain1", Region: "USA", …}
1: {CustomerName: "CName2", ContactName: "contact2", ContactEmail: "email2#example.com", SubdomainName: "domain2", Region: "USA", …}
2: {CustomerName: "CName3", ContactName: "contact3", ContactEmail: "email3#example.com", SubdomainName: "domain3", Region: "USA", …}
3: {CustomerName: "CName4", ContactName: "contact4", ContactEmail: "email4#example.com", SubdomainName: "domain4", Region: "USA", …}
4: {CustomerName: "Sudhakar", ContactName: "contact5", ContactEmail: "email5#example.com", SubdomainName: "domain5", Region: "USA", …}
5: { …}
My Javascript:
$scope.doExport = function(list){
var sheet_name = 'clients.xlsx'
var arrayToExport = {};
var arrData = [];
$scope.list = list;
var i = 0;
angular.forEach($scope.list, function(value, key){
var status = (value.status == 0) ? 'Pending' : 'Active';
var region = value.region;
region = region.toUpperCase();
var initial = value.subscr_end_date.split(/\-/);
var finalDate = [ initial[1], initial[2], initial[0] ].join('/');
//console.log( finalDate );
arrData[i] = {CustomerName:value.client_info.first_name,ContactName:value.client_info.last_name, ContactEmail:value.client_info.email,SubdomainName:value.sub_domain_name,Region:region,Status:status,SubscriptionEndDate:finalDate
};
i++;
});
arrayToExport = [arrData];
console.log(arrayToExport);
alasql('SELECT * INTO XLSX("'+sheet_name+'",{headers:true}) FROM ?', arrayToExport);
}
Can anyone direct me how to display values of array in separate columns with ng-repeat? Please note that fields are dynamically generated and I cannot hardcode name of fields like tran.id, or tran.firstname....
thanks
My html is:
<tr ng-repeat="tran in trans">
<td>{{ tran }}</td>
</tr>
My JS code is:
$scope.displayTrans = function(){
$http.get("model/selecttrans.php")
.then(function(response) {
console.log(response.data);
$scope.trans = response.data;
});
}
and my PHP code is:
<?php
$sql = "SELECT * FROM trans";
$stmt = $conn->prepare($sql);
$stmt->execute();
$total = $stmt->rowCount();
if ($total > 0 ) {
while ($row = $stmt->fetchObject()) {
$output[] = $row;
}
} else {
$output = 'No data';
}
echo json_encode($output);
I am getting following output in my console:
[…]
0: {…}
"$$hashKey": "object:15"
email: null
firstname: "Aziz"
id: "19"
lastname: "Virani"
password: "12345"
__proto__: Object { … }
1: {…}
"$$hashKey": "object:16"
email: "test#test.edu"
firstname: "Test"
id: "32"
lastname: "Result"
password: "test"
__proto__: Object { … }
length: 2
__proto__: Array []
and following output in my browser:
{"id":"19","lastname":"Virani","password":"12345","firstname":"Aziz","email":null}
{"id":"32","lastname":"Result","password":"test","firstname":"Test","email":"test#test.edu"}
Can any one suggest me how can I display output in separate columns as mentioned below:
id | lastname | password
32 | Result | test
Please ignore validation here like password should be hashed or md5 etc.....
I can easily get data by typing {{ tran.id }} or {{ tran.firstname }} but these fields are dynamically generated and i cannot hardcode fields name....
thank you
Aziz
So I figured out the way to display output....
Earlier I used nested ng-repeat with (key, value) with table row property but here on some other blog i found that nested ng-repeat works with table data so I updated my code and everything works cool....
I have an object in the controller which value I am getting from http GET request:
$scope.myObj = {
id1: "1",
id2: "5",
id3: "",
id4: ""
};
It can have any number of fields (id...) with any values. But if id-k is not empty all id-n where n < k is not empty too.
I need to bind to INPUT last not empty field of the object. What is best way to do it?
Here is a plnkr
Update: This object is a position in the classificator.
In my example ID of position is 1.5. I need to allow edit only last position in the classification. The user can change 5 to 6, 7 or anything else, but it can not change 1 segment
If the object will be
$scope.myObj = {
id1: "2",
id2: "5",
id3: "4",
id4: "8"
};
The classification is 2.5.4.8 and user must be able edit only last segment - 8.
Controller
...
$scope.myObj = {
id1: "1",
id2: "5",
id3: "6",
id4: ""
};
$scope.segments = Object.keys($scope.myObj)
.filter(function(key) {
return $scope.myObj[key];
})
.sort(function(a, b){
return Number(a.replace('id', '')) - Number(b.replace('id', ''));
});
...
HTML
<span ng-repeat="segment in segments">
<span ng-if="!$last">{{ myObj[segment] }}</span>
<input ng-if="$last" ng-model="myObj[segment]">
</span>
<p>{{ myObj }}</p>
Plnkr - https://plnkr.co/edit/8C9lLLdCvvzFinaOXqtd?p=preview
Original Answer
You can calculate the last non blank id in the controller and set it to a scope variable. Something like
$scope.myLast = $scope.myObj['id' + Object.keys($scope.myObj).reduce(function(a, key){
if ($scope.myObj[key]) {
var idNum = Number(key.replace('id', ''));
a = Math.max(a, idNum)
}
return a;
}, -Infinity)];
Note - you can't rely on the order of keys, so you can't actually assume that the last key is the biggest one.
Plnkr - https://plnkr.co/edit/apy8qZNJNK4Q23J5Ja4N?p=preview
I need to bind to INPUT..
So it seems ,what you have is , a list of objects where the no. of elements in the list can vary.. and you want to bind all of them to <input>
If so then this would do the job:
<div ng-init="tempName = key" ng-repeat="(key, value) in myObj">
<label for="{{key}}" >{{key.toUpperCase()}}</label>
<input name="{{key}}" id="{{key}}" type="text" ng-model="myObj[tempName]" />
</div>
here's an awesome plunkr doing just that
EDIT:
To ignore the empty fields : use this