pnp / sp-dev-fx-aces

Repository for the Microsoft Viva Connections Adaptive Card sample solutions from Microsoft and community.
https://aka.ms/viva/connections/extensibility
MIT License
112 stars 95 forks source link

Multilingual Adaptive Cards #41

Closed harshdamaniahd closed 2 years ago

harshdamaniahd commented 2 years ago

Hi,

Like we can do localization for strings in SPFX, can we do the same thing in adaptive card templates ?

Also the text on the card for eg primary text, if we set it from localization file dynamically it doesnt work

ArijitCloud commented 2 years ago

Hi @harshdamaniahd, it should work. I have updated my sample to support localization, once the PR is merged, do check out after cloning it.

harshdamaniahd commented 2 years ago

yep it works normally for static content. but in quick view i have dynamic binding, how can i use strings.localizedfield ?

dcashpeterson commented 2 years ago

In your quickview.ts file you should see something like

import * as strings from 'MYACEAdaptiveCardExtensionStrings';

and in that file you can reference values like strings.MyLocalString

Add a reference to the strings object to the IQuickViewData like strings: IMYACEAdaptiveCardExtensionStrings;

and then in your data() method add it as a property like so strings: strings

In your template.json file you can reference any value like this ${strings.MyLocalString}

If you are inside of a loop of data then you might need to reference the root like this ${$root.strings.MyLocalString}

There will be more sample coming up with this methodology soon.

Hope that helps.

harshdamaniahd commented 2 years ago

Hey thanks. I tired something similar. I created a constant file and used it import * as strings from "JobListingAdaptiveCardExtensionStrings";

export const FormTemplateLabels = {
 daystoapply:strings.DaysToApply
};
export interface IQuickViewData {
  jobPostings: IListPostings[];
//created a constant file
  labels: any;
  day:string;
}
 public get data(): IQuickViewData {
    return {

      jobPostings: this.state.jobpostings,
      labels:FormTemplateLabels,
      day:strings.DaysToApply
    };

}

tried both inside and outside loop

{
"type": "TextBlock",
      "text": "${$root.days.daystoapply}",
      "wrap": true
    }
# # {
"type": "TextBlock",
      "text": "${$root.labels.daystoapply}",
      "wrap": true
    }

but it doesnt work :-( dont know what is wrong

dcashpeterson commented 2 years ago

So what isn't working? Is it outputting no string or the wrong language.

harshdamaniahd commented 2 years ago

Ahh now it works. Same code. :-) Thanks for help 👍 Let me test it and then i can go ahead and close it. 💯

dcashpeterson commented 2 years ago

resolved