I have implemented $expand REST service(SAP NW Gateway) which is working fine..here I am performing $exapnd of odata, and I developing my front-end using Angular.
I am struggling to read the child result-set of payload, below is my sample payload
{
d:
{
results:
[1]
0:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/HeaderDetails('4500077411')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/HeaderDetails('4500077411')"
type: "MYEXPAND.Header"
}
-
CCode: "1042"
PONumber: "4500077411"
DocType: "UB"
NavItem:
{
results:
[2]
0:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00010')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00010')"
type: "MYEXPAND.Item"
}
-
PoNumber: "4500077411"
PoItem: "00010"
Material: "A10001"
}
-
1:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00020')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00020')"
type: "MYEXPAND.Item"
}
-
PoNumber: "4500077411"
PoItem: "00020"
Material: "E-M-SAMS-Q001-0009"
}
-
-
}
-
}
-
-
}
-
}
in my controller I can read like $scope.resultsset= data.d.dresults, but here in Expand I need to read my child data from navitem-results for the respective PONumber results.
here is with indentation
{
d:
{
results:
[1]
0:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/HeaderDetails('4500077411')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/HeaderDetails('4500077411')"
type: "MYEXPAND.Header"
}
-
CCode: "1042"
PONumber: "4500077411"
DocType: "UB"
NavItem:
{
results:
[2]
0:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00010')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00010')"
type: "MYEXPAND.Item"
}
-
PoNumber: "4500077411"
PoItem: "00010"
Material: "A10001"
}
-
1:
{
__metadata:
{
id: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00020')"
uri: "host:port/sap/opu/odata/sap/MYEXPAND/Items(PoNumber='4500077411',PoItem='00020')"
type: "MYEXPAND.Item"
}
-
PoNumber: "4500077411"
PoItem: "00020"
Material: "E-M-SAMS-Q001-0009"
}
-
-
}
-
}
-
-
}
-
}
help me to sort this, thanks
Rajesh
resolved my self after searching few more things in google, below is the way I cracked it
<ul>
<li ng-repeat="Y in results">
<ul>
<li ng-repeat=" Z in Y.NavItem.results">
<b>PO Number </b>: {{Z.PoNumber}}
<b>PO Item </b>: {{Z.PoItem}}
<b>Material</b> : {{Z.Material}}
</li>
</ul>
</li>
</ul>
Thanks for the support
Rajesh
Related
I added a yandex.metrica script (w ecommerce layer) in my index.html
<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
m[i].l=1*new Date();
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(id, "init", {
clickmap:true,
trackLinks:true,
accurateTrackBounce:true,
webvisor:true,
ecommerce: "dataLayer"
});
</script>
<!-- /Yandex.Metrika counter -->
I need to send some data-objects to ecommerce layer like this dataLayer.push({ ecommerce: "someData" }), but i dont understand how to do it correctly inside a react component...
it should work just like other events for YM
window.ym(yaCounterId, "reachGoal", eventName)
window.dataLayer.push({
ecommerce: {
currencyCode: 'RUB',
add: {
products: [
{
id: '43521',
name: 'Yandex bag',
price: 654.32,
brand: 'Yandex / Яndex',
category: 'Accessories/Bags',
quantity: 1,
},
],
},
},
});
just create wrapper function to make it look better
I'm implementing on a website a tool from Sales Force that is called Interaction Studio.
We need to develop into a sitemap file, where those interaction written into the file will catch the information that we need.
Here we have an example of a sitemap
Basically, the function that collects the categories is a custom function that collects the information from the breadcrumb. The function is:
const getCategoriesIdAsArray = () => {
return Evergage.resolvers.fromSelectorAttributeMultiple(
"a.c-breadcrumb__link",
"href",
(link) => {
let catId = "";
if (link.length) {
link.shift();
link.map((url, index) => {
if (index < link.length - 1) {
catId += url.split("/").reverse()[0].split("-")[0] + "|";
} else {
catId += url.split("/").reverse()[0].split("-")[0];
}
});
return [catId];
} else {
return;
}
}
);
};
To collect the information, we need to write some code in the pageTypes array. This following code is what I have in my sitemap:
pageTypes: [
{
name: "product_detail_tecnico",
action: "product_detail_tecnico",
//isMatch: () => document.body.classList.contains("is-tech-product"),
isMatch: () => {
return Evergage.DisplayUtils.pageElementLoaded(
"body#productcore.is-tech-product",
"html"
).then(() => true);
},
locale: () => {
return buildLocale();
},
catalog: {
Product: {
_id: productId,
name: Evergage.resolvers.fromJsonLd("name"),
url: Evergage.resolvers.fromJsonLd("url"),
imageUrl: Evergage.resolvers.fromJsonLd("image"),
description: Evergage.cashDom("meta[name='description']")
.first()
.attr("content")
.substring(0, 250),
decoTecnico: () => {
return bodyClasses.includes("is-deco-product");
},
inventoryCount: 1,
idc: productId && productId.split("_")[1],
idp: getProductIdFromUrl(),
price: Evergage.resolvers.fromJsonLd("offers.0.price"),
precioAnterior: Evergage.util.getFloatValue(
Evergage.cashDom(".c-product-price__before .js-old-price")
.first()
.text()
.split(" ")[0]
.replace(",", ".")
),
video: Evergage.cashDom("iframe#player").attr("src"),
categories: () => {
return getCategoriesIdAsArray();
},
},
},
]
As we can see, the last attribute, categories returns the value from the custom function that is an array with one string due to the data that I must pass in.
The data that I get on the visual editor:
In the sitemap into the pageTypes I also have this code:
{
name: "Category",
action: "Viewed Category",
isMatch: () => {
return Evergage.DisplayUtils.pageElementLoaded(
"body.categorycore",
"html"
).then(() => true);
},
catalog: {
Category: {
_id: getCategoriesId(),
//parentId: categoryParentId,
name: categoryName,
department: () => isDepartment(),
url: Evergage.resolvers.fromHref(),
description: Evergage.cashDom("meta[name='description']")
.first()
.attr("content"),
},
},
listeners: [
Evergage.listener("click", "section.c-distributive-filters", () => {
Evergage.sendEvent({
action: "Filter Results",
});
}),
],
},
This code is required because to assign a category to a product, we must have that category recorded in the UI.
As we can see in the next picture, the categories are recorded.
The event stream is recording the following:
This is the code from item:
{
description:
"Tira LED 12V DC 30LED/m 5m IP20 Ancho 10mm es una opción muy extendida si se desea disponer de una luz decorativa que consuma muy poco. Su diseño flexi...",
idc: "122262",
inventoryCount: 1,
type: "Product",
url: "https://dev61.efectoled.com/es/comprar-tiras-led-monocolor/62294-tira-led-12v-dc-smd5050-30ledm-5m-ip20.html",
idp: "62294",
price: 7.95,
imageUrl:
"https://4438d3e301b6821c9a36cfd759bc58f8/442295-thickbox_default/tira-led-12v-dc-smd5050-30ledm-5m-ip20.jpg",
name: "Tira LED 12V DC 30LED/m 5m IP20 Ancho 10mm",
decoTecnico: false,
attributes: {
idp: { value: "62294" },
decoTecnico: { value: false },
idc: { value: "122262" },
},
id: "62294_122262",
categories: [{ _id: "10|63|24", type: "c" }],
}
But when I go into the details of a product, the categories are not.
I have read all the documentation that Interaction Studio provides, but I can not understand what happens. Because in the visual editor the data is recorded and in the event stream also is recorded.
Does anybody know why this is happening? Thanks in advance
I am trying to filter an array using a computed property in vue.js. I would like to search on on multiple fields, name, state, tags etc.
My data:
events: [
{
id: 1,
name: 'Name of event',
url: '#',
datetime: '2017-05-10T00:00:00Z',
description: 'The full text of the event',
state: 'VIC',
tags: [
'ordinary',
'advanced'
]
},
{
id: 2,
name: 'Another event',
url: '#',
datetime: '2017-05-12T00:00:00Z',
description: 'The full text of the event',
state: 'VIC',
tags: [
'beginner'
]
},
{
id: 3,
name: 'Great event',
url: '#',
datetime: '2017-05-18T00:00:00Z',
description: 'The full text of the event',
state: 'NSW',
tags: [
'beginner'
]
}
]
},
The following function works as expected, however I cant work out how to have it search the items in 'tags' (commented out).
searchevents: function(){
let result = this.events
if (this.filterValue){
result = result.filter(event =>
event.name.toLowerCase().includes(this.filterValue.toLowerCase()) ||
event.state.toLowerCase().includes(this.filterValue.toLowerCase())
// event.tags.toLowerCase().values().includes(this.filterValue.toLowerCase())
)
}
return result
}
The following returns a blank array, this method works ok when i have done it in angular but not in vue.
searchevents2: function(){
var searchRegex = new RegExp(this.filterValue,'i')
this.events.filter(function(event){
return !self.filterValue || searchRegex.test(event.name) || searchRegex.test(event.state)
})
}
Ideally I would either like to be able to list array items to filter by or just filter by the entire array.
Appreciate any help, first post here so be gentle. I have a lot more experience with Python than Javascript so i may also use incorrect terminology at times.
You weren't too far off.
For your searchEvents filter, you just needed to add the tag filter. Here's how you might do that.
searchevents: function(){
let result = this.events
if (!this.filterValue)
return result
const filterValue = this.filterValue.toLowerCase()
const filter = event =>
event.name.toLowerCase().includes(filterValue) ||
event.state.toLowerCase().includes(filterValue) ||
event.tags.some(tag => tag.toLowerCase().includes(filterValue))
return result.filter(filter)
}
Array.some() is a standard array method that returns true if any element of the array passes your test.
searchevents2: function(){
const searchRegex = new RegExp(this.filterValue,'i')
return this.events.filter(event =>
!this.filterValue || searchRegex.test(event.name) || searchRegex.test(event.state))
}
With searchEvents2 you really only left an errant self in there. Either you needed to set self before you executed the filter, or, as I have done here, turned it into an arrow function.
Example.
const app = new Vue ({
el: '#app',
data: {
search: '',
userList: [
{
id: 1,
name: "Prem"
},
{
id: 1,
name: "Chandu"
},
{
id: 1,
name: "Shravya"
}
]
},
computed: {
filteredAndSorted(){
// function to compare names
function compare(a, b) {
if (a.name < b.name) return -1;
if (a.name > b.name) return 1;
return 0;
}
return this.userList.filter(user => {
return user.name.toLowerCase().includes(this.search.toLowerCase())
}).sort(compare)
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.js"></script>
<div id="app">
<div class="search-wrapper">
<input type="text" v-model="search" placeholder="Search title.."/>
<label>Search Users:</label>
</div>
<ul>
<li v-for="user in filteredAndSorted">{{user.name}}</li>
</ul>
</div>
I am working on an Ionic project with the plugin angular translate from Pascal Precht. I am able to translate stuff like the title in the view etc. But I need to translate my content and this is where I am a bit lost.
So I have 2 arrays (one in English and the other in Dutch), the array looks like this (each array has 14 object in them - for the purpose of this explanation i will just show 1 object in the array):
gin_mixes: [
{
id: '1',
title: 'Bathtub Gin Mix',
src: 'img/placeholder-bathtub-gin-colored.png',
backdrop: 'img/backdrop_bathtub-gin.jpg',
lang: 'en',
ingredients: [
{
ingred1: 'Bathtub Gin - 5 cl',
ingred2: 'Cardamom - 2 pcs',
ingred3: 'Clove - 3 pcs',
ingred4: 'Orange wedges - 2 pcs'
}
],
picturesIngred : [
{
pictIng1: 'img/bathtub-gin.jpg',
pictIng2: 'img/kardemon.jpg',
pictIng3: 'img/kruidnagels.jpg',
pictIng4: 'img/orange-wedges.jpg',
}
],
tonics: [
{
tonic1: 'Fever Tree Premium Indian Tonic',
tonic2: 'Indi Tonic',
tonic3: 'Schweppes Premium Tonic Water',
tonic4: 'Thomas Henry Tonic Water'
}
],
pictureTonics: [
{
pictTonic1: 'img/fever-tree.jpg',
pictTonic2: 'img/indie-tonic.jpg',
pictTonic3: 'img/schweppes-premium.jpg',
pictTonic4: 'img/thomas-henry.jpg',
}
],
utensils: [
{
utens1: 'Measuring cup',
utens2: 'Spoon',
utens3: 'Peeler',
utens4: 'Pestle'
}
],
recipe: [
{
step1: 'Fill a glass with ice cubes',
step2: 'Add the orange wedges together with the 3 pieces of clove in the glass together with 2 mashed cardamons ',
step3: 'Poor 5 cl of Bathtub Gin into the glass',
step4: 'And lastly add 20 cl of tonic to the mix'
}
]
}
]
In my settings view I give the user the option to switch between English and Dutch. When the user chooses for example Dutch then my app changes languages and I can see my translated changes (title in view etc).
But what I now need is to know is how to dynamically change the content with my 2 arrays. So if the user choose English as the language then the content has to show up in english (content from array).
I am NOT working with an external json file. The array I implemented in my service like so:
.service('GinTonicService', function($q){
return {
gin_mixes_en: [
{
id: '1',
...
},
{
id: '2',
....
},
],
gin_mixes_nl: [
{
id: '1',
...
},
{
id: '2',
....
},
],
getGinMixesEN: function(){
return this.gin_mixes_en;
},
getGinMixByIdEN: function(id){
var d = $q.defer();
this.gin_mixes_en.forEach(function(ginmix) {
if (ginmix.id === id) d.resolve(ginmix);
})
return d.promise;
},
getGinMixesNL: function(){
return this.gin_mixes_nl;
},
getGinMixByIdNL: function(id){
var d = $q.defer();
this.gin_mixes_nl.forEach(function(ginmix) {
if (ginmix.id === id) d.resolve(ginmix);
})
return d.promise;
}
}
});
Now I am able to read out the content in english like so (part of my html view):
<div class="list card padding">
<h4 class="p_benodigdheden" translate='utensils'></h4>
<br>
<div class="custom_list" ng-repeat="utensils in getGinMixById.utensils">
<ul>
<li>{{utensils.utens1}}</li>
<li>{{utensils.utens2}}</li>
<li>{{utensils.utens3}}</li>
<li ng-hide="!utensils.utens4.length">{{utensils.utens4}}</li>
</ul>
</div>
</div>
Which looks like this:
In the controller:
$scope.startCount = 0;
$scope.vs = function (number) {
$scope.startCount = number;
}
$scope.startTimeout = function () {
$scope.startCount = $scope.startCount + 1;
mytimeout = $timeout($scope.startTimeout, 1000);
}
$scope.startTimeout();
$scope.stopTimeout = function () {
$timeout.cancel(mytimeout);
alert("Timer Stopped");
}
$scope.meals = [
{ title: 'Abs', url:"#/app/mworkouts",id: 100, img: "img/female.jpg", vid:"vid/1.mp4",},
{ title: 'Arms', url:"#/app/browse",id: 2 , img: "img/male.jpg", vid:"vid/2.mp4"},
{ title: 'Biceps', url:"#/app/search",id: 3, img: "img/Spotify_2.jpg", vid:"vid/1.mp4" },
{ title: 'Legs', url:"#/app/search",id: 4, img: "img/Spotify_4.jpg", vid:"vid/2.mp4" },
{ title: 'Core', url:"#/app/mworkouts",id: 5, img: "img/female.jpg", vid:"vid/1.mp4" },
{ title: 'Back', url:"#/app/mworkouts",id: 6, img: "img/male.jpg", vid:"vid/2.mp4" }
];
In the html:
<div ng-repeat="m in meals">
<button ng-click='vs({{m.id}})'>Setter</button>
</div>
So how it is supposed to work is pass in a number from the array and then count up using $timeout. It works perfectly fine if I enter in a number manually but I want the number to come from the array. Also, {{m.id}} is definelty a number because I have tested it {{m.id-60}} and it works. I am have no idea what is wrong.
Sorry about the weird names...it's just an example :)
Just get rid of the {{}}
ng-click='vs(m.id)'
It's seems to work for me here! I added couple of log for you to make sure
<div ng-repeat="m in meals">
<button ng-click='vs(m.id)'>Setter</button>
</div>
http://plnkr.co/edit/tpl:rfqcl9AHEoJZEEJxyNn2?p=preview