productData(id){
this.id=id;
console.log("id"+this.id);
let headers = new Headers();
this.createAuthorizationHeader(headers);
return this.http.get(SharedServiceService.productDetails+this.id,{
headers:headers
})
.subscribe(data => {
const products = data.json();
this.productInfo=products;
this.cart = this.storage.retrieve('cartList');
for(var i=0;i<this.cart.length;i++){
if(this.id==this.cart[i].id){
this.addedOne=false;
this.hideCart=true;
this.continueShopping=false;
}
}
var attr=[];
var storeLoc=[];
attr.push(this.productInfo);
console.log("attr",attr);
for(var i=0;i<attr[0].attributes.length;i++){
if((attr[0].attributes[i].name=='Next day store pickup') || (attr[0].attributes[i].name=='Store pickup')|| (attr[0].attributes[i].name=='Delivery price')|| (attr[0].attributes[i].name=='Shipping price')){
this.prices.push(attr[0].attributes[i]);
}
console.log(this.prices);
}
for(var i=0;i<attr[0].attributes.length;i++){
if(attr[0].attributes[i].name=='Stores'){
for(var j=0;j<attr[0].attributes[i].options.length;j++){
storeLoc.push(JSON.stringify(attr[0].attributes[i].options[j]));
}
}
}
storeLoc.map((obj) => {
let data = obj.replace(/”/g, '"');
data = data.replace(/“/g, '"');
this.stores.push(JSON.parse(data));
})
console.log("stores",(this.stores));
console.log("id info"+JSON.stringify(this.productInfo));
},
err => {
console.log("Error!: ",err);
}
);
}
storeLoc= [
"{“street”:”3104 Doctors Drive”,”city”:”Los Angeles”,”state code”:”CA”,”state”:”California”,”zip code”:”90017”}",
"{“street”:”3358 Cinnamon Lane”,”city”:”San Antonio”,”state code”:”TX”,”state”:”Texas”,”zip code”:”78212”}",
"{“street”:”573 May Street”,”city”:”Harold”,”state code”:”KY”,”state”:”Kentucky”,”zip code”:”41635”}",
"{“street”:”2836 Cantebury Drive”,”city”:”New York”,”state code”:”NY”,”state”:”New York”,”zip code”:”10013”}",
"{“street”:”2935 Kidd Avenue”,”city”:”St George”,”state code”:”AK”,”state”:”Alaska”,”zip code”:”99591”}",
"{“street”:”3676 Spirit Drive”,”city”:”Jacksonville”,”state code”:”FL”,”state”:”Florida”,”zip code”:”32220”}",
"{“street”:”2134 Shobe Lane”,”city”:”Moody”,”state code”:”AL”,”state”:”Alabama”,”zip code”:”35004”}",
"{“street”:”3614 Rhapsody Street”,”city”:”Aiea”,”state code”:”HI”,”state”:”Hawaii”,”zip code”:”96701”}",
"{“street”:”1756 Forest Drive”,”city”:”Ashburn”,”state code”:”VA”,”state”:”Virginia”,”zip code”:”22011”}",
"{“street”:”686 Upland Avenue”,”city”:”Toledo”,”state code”:”OH”,”state”:”Ohio”,”zip code”:”43609”}",
"{“street”:”574 Copperhead Road”,”city”:”Abercrombie”,”state code”:”ND”,”state”:”North Dakota”,”zip code”:”58001”}",
"{“street”:”3106 Tecumsah Lane”,”city”:”Van Horne”,”state code”:”IA”,”state”:”Iowa”,”zip code”:”52346”}"
]I am currently developing an Angular4 application where I receive response data in the form of an array containing strings of objects. My challenge is to display each object individually using ngFor directive. However, I am facing difficulty in displaying the data as the object properties are in string format. Below is my problem:
"options": [
"{“street”:”3104 Doctors Drive”,”city”:”Los Angeles”,”state code”:”CA”,”state”:”California”,”zip code”:”90017”}",
"{“street”:”3358 Cinnamon Lane”,”city”:”San Antonio”,”state code”:”TX”,”state”:”Texas”,”zip code”:”78212”}",
"{“street”:”573 May Street”,”city”:”Harold”,”state code”:”KY”,”state”:”Kentucky”,”zip code”:”41635”}",
"{“street”:”2836 Cantebury Drive”,”city”:”New York”,”state code”:”NY”,”state”:”New York”,”zip code”:”10013”}",
"{“street”:”2935 Kidd Avenue”,”city”:”St George”,”state code”:”AK”,”state”:”Alaska”,”zip code”:”99591”}",
"{“street”:”3676 Spirit Drive”,”city”:”Jacksonville”,”state code”:”FL”,”state”:”Florida”,”zip code”:”32220”}",
"{“street”:”2134 Shobe Lane”,”city”:”Moody”,”state code”:”AL”,”state”:”Alabama”,”zip code”:”35004”}",
"{“street”:”3614 Rhapsody Street”,”city”:”Aiea”,”state code”:”HI”,”state”:”Hawaii”,”zip code”:”96701”}",
"{“street”:”1756 Forest Drive”,”city”:”Ashburn”,”state code”:”VA”,”state”:”Virginia”,”zip code”:”22011”}",
"{“street”:”686 Upland Avenue”,”city”:”Toledo”,”state code”:”OH”,”state”:”Ohio”,”zip code”:”43609”}",
"{“street”:”574 Copperhead Road”,”city”:”Abercrombie”,”state code”:”ND”,”state”:”North Dakota”,”zip code”:”58001”}",
"{“street”:”3106 Tecumsah Lane”,”city”:”Van Horne”,”state code”:”IA”,”state”:”Iowa”,”zip code”:”52346”}"
]This is the array that needs to be displayed. How can I implement the code for this array in Angular4?