How do i display nested objects to the template in angular 8? - angular8

This is the object i received i want to print nxt_performance_metrics as table. i didn't how to proceed.if someone knows help me if possible
Bearing: {
precision: "0.99", recall: "1.00", f1-Score: "0.99", support: "90"
}
Flywheel: {
precision: "1.00", recall: "0.99", f1-Score: "0.99", support: "90"
}
Healthy: {
precision: "1.00", recall: "0.99", f1-Score: "0.99", support: "90"
}
LIV: {
precision: "0.99", recall: "0.99", f1-Score: "0.99", support: "90"
}
LOV: {
precision: "0.98", recall: "1.00", f1-Score: "0.99", support: "90"
}
NRV: {
precision: "1.00", recall: "0.98", f1-Score: "0.99", support: "90"
}
Piston: {
precision: "1.00", recall: "1.00", f1-Score: "1.00", support: "90"
}
Riderbelt: {
precision: "0.98", recall: "0.99", f1-Score: "0.98", support: "90"
}
accuracy: {
precision: " ", recall: " ", f1-Score: "0.99", support: "720"
}
macro avg: {
precision: "0.99", recall: "0.99", f1-Score: "0.99", support: "720"
}
weighted avg: {
precision: "0.99", recall: "0.99", f1-Score: "0.99", support: "720"
}

What you can do is make use of Object.keys() to iterate over the response.
// component.html
<table>
<thead>
<th>precision</th>
<th>recall</th>
<th>f1-Score</th>
<th>support</th>
</thead>
<tbody>
<tr *ngFor="let item of Object.keys(response)">
<td>{{item.precision}}</td>
// add more columns based on keys
</tr>
</tbody>
</table>

Related

Problem of integration krakend with keycloak

I have keycloak bitnami chart and krakend deployed in in k8s. Also I have a test api, and I want being authenticated before access it. I'm able to get valid jwt token from keycloak, but when I'm trying to access my api through krakend, it returns 401 error
Any help is really appreciated.
Software versions:
keycloak: 16.1.1
crakend: 2.0.4
{
"$schema": "https://www.krakend.io/schema/v3.json",
"version": 3,
"timeout": "3000ms",
"cache_ttl": "300s",
"output_encoding": "json",
"port": 8080,
"endpoints": [
{
"endpoint": "/mock/parents/{id}",
"method": "GET",
"input_headers": [
"Authorization"
],
"extra_config": {
"auth/validator": {
"alg": "RS256",
"jwk-url": "http://keycloak-headless:8080/auth/realms/master/protocol/openid-connect/certs",
"disable_jwk_security": true,
"roles_key_is_nested": true,
"roles_key": "realm_access.roles",
"roles": ["test-app-parent"],
"operation_debug": true
}
},
"output_encoding": "json",
"concurrent_calls": 1,
"backend": [
{
"url_pattern": "/parents/{id}",
"encoding": "json",
"sd": "static",
"extra_config": {},
"host": [
"http://testapp-service:8400"
],
"disable_host_sanitize": false,
"blacklist": [
"super_secret_field"
]
},
{
"url_pattern": "/siblings/{id}",
"encoding": "json",
"sd": "static",
"extra_config": {},
"host": [
"http://testapp-service:8400"
],
"blacklist": [
"sibling_id"
],
"group": "extra_info",
"disable_host_sanitize": false
},
{
"url_pattern": "/parents/{id}/children",
"encoding": "json",
"sd": "static",
"extra_config": {},
"host": [
"http://testapp-service:8400"
],
"disable_host_sanitize": false,
"mapping": {
"content": "cars"
},
"whitelist": [
"content"
]
}
]
},
{
"endpoint": "/mock/bogus-new-api/{path}",
"method": "GET",
"extra_config": {
"auth/validator": {
"alg": "RS256",
"jwk-url": "http://keycloak-headless:8080/auth/realms/master/protocol/openid-connect/certs",
"disable_jwk_security": true
},
"github.com/devopsfaith/krakend/proxy": {
"static": {
"data": {
"new_field_a": 123,
"new_field_b": [
"arr1",
"arr2"
],
"new_field_c": {
"obj": "obj1"
}
},
"strategy": "always"
}
}
},
"output_encoding": "json",
"concurrent_calls": 1,
"backend": [
{
"url_pattern": "/not-finished-yet",
"encoding": "json",
"sd": "static",
"extra_config": {},
"host": [
"nothing-here"
],
"disable_host_sanitize": false
}
]
}
]
}
Oh my God this made me go insane.
In one of the last version updates they changed jwk-url to jwk_url.
https://github.com/krakendio/krakend-ce/issues/495#issuecomment-1138397005
After I fixed that it worked for me.
It worked for me after I changed
"jwk_url": "http://KEYCLOAK-SERVICE-NAME:8080/auth/realms/master/protocol/openid-connect/certs" to "jwk_url": "http://host.docker.internal:8080/auth/realms/master/protocol/openid-connect/certs"

How to store the value in local storage using vue.js

I am trying to use local storage for storing the multistep form values.So here the issue is if i am entering the values at input fields and all the values are storing at local storage. But while I am signing in with other mails then the same value are appearing in the form which is enterd with before mail. So here the same entered value should not appear while we login with other mail. So where i am going wrong please tell me
<vue-form-g :schema="schema_Antiques" :model="model" :options="formOptions"></vue-form-g>
new Vue({
el: '#q-vikreya',
components: {
"vue-form-g": VueFormGenerator.component
},
data() {
return {
model:{}
},
schema_Antiques: {
fields: [{
type: "input",
inputType: "text",
placeholder: "Type",
model: "Type",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Origin",
required: true,
model: "Origin",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Age",
required: true,
model: "Age",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Condition",
required: true,
model: "Condition",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Size",
required: true,
model: "Size",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Maker",
required: true,
model: "Maker",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Material",
required: true,
model: "Material",
styleClasses: ["half-width col-xs-12 col-sm-4", "job_title"]
}, {
type: "textArea",
model: "Other_specializations",
max: 500,
placeholder: "Other specializations",
styleClasses: ["half-width col-xs-12 col-sm-4", "Experience"]
}]
},
mounted() {
if (localStorage.getItem('model') !== null)
this.model = JSON.parse(localStorage.getItem('model'));
},
methods: {
localStorage.setItem('model', JSON.stringify(this.model));
}

Migration of Work Items from TFS 2018 to Azure DevOps 2020 fails to migrate links between Work Items

I am exploring different possibilities to move our organisations Work Items from a TFS 2018 (v. 16.131.28507.4) to Azure DevOps 2020 (v. Dev18.M170.6). with Azure DevOps Migration Tools.
I am now struggling with parts of the migration tools (v. 11.11)
All Work Items do copy to the target environment, the iterations and areas are in place as well as the teams and team areas. The field "ReflectedWorkItemId" is also updated correctly in my target.
But looking in Azure, not one work item in the target environment has any links to its children or parents. In the migration tools logs there's a lot of warnings which I guess are related to my problem.
"[SKIP] [LINK_CAPTURE_RELATED] [RegisteredLinkType] target not found. wiSourceL=38673, wiSourceR=null, wiTargetL=12410"
The parent and the children WI's is present in Azure with but I am guessing I am missing something in the configuration.
In my source I am using the project type "Agile". In my target I've created an inherited project from Agile (with name "OrgAgile" to be able to add the "ReflectedWorkItemId" field in the process templates. Can that be an issue?
I see one issue have been posted on the tools GitHub (https://github.com/nkdAgility/azure-devops-migration-tools/issues/964) and I've posted a question there myself but no answers yet so I thought I try here. It could be a bug, but I want to make sure I haven't done the configuration wrong.
Below is the configuration.json. Perhaps I've removed/missed configuration from the default file that is crucial for a correct link migration or have redundant/conflicting parts in it.
Any help, pointers or roasts is most welcome.
configuration.json
{
"Version": "11.11",
"workaroundForQuerySOAPBugEnabled": false,
"GitRepoMapping": null,
"LogLevel": "Information",
"Source": {
"$type": "TfsTeamProjectConfig",
"Collection": "http://<sourceServer>/DefaultCollection",
"Project": "<sourceProject>",
"ReflectedWorkItemIDFieldName": "TfsMigrationTool.ReflectedWorkItemId2",
"AllowCrossProjectLinking": false,
"AuthenticationMode": "Prompt",
"PersonalAccessToken": "",
"LanguageMaps": {
"AreaPath": "Area",
"IterationPath": "Iteration"
}
},
"Target": {
"$type": "TfsTeamProjectConfig",
"Collection": "http://<targetServer>/DefaultCollection",
"Project": "<targetProject>",
"ReflectedWorkItemIDFieldName": "ReflectedWorkItemId",
"AllowCrossProjectLinking": false,
"AuthenticationMode": "Prompt",
"PersonalAccessToken": "",
"LanguageMaps": {
"AreaPath": "Area",
"IterationPath": "Iteration"
}
},
"Processors": [
{
"$type": "TfsAreaAndIterationProcessorOptions",
"Enabled": true,
"PrefixProjectToNodes": false,
"NodeBasePaths": null,
"ProcessorEnrichers": null,
"SourceName": "IterationSettingsSource",
"TargetName": "IterationSettingsTarget"
},
{
"$type": "TfsTeamSettingsProcessorOptions",
"Enabled": true,
"MigrateTeamSettings": true,
"UpdateTeamSettings": true,
"PrefixProjectToNodes": false,
"Teams": null,
"ProcessorEnrichers": null,
"SourceName": "TeamSettingsSource",
"TargetName": "TeamSettingsTarget"
},
{
"$type": "WorkItemMigrationConfig",
"Enabled": true,
"ReplayRevisions": true,
"PrefixProjectToNodes": false,
"UpdateCreatedDate": true,
"UpdateCreatedBy": true,
"BuildFieldTable": false,
"AppendMigrationToolSignatureFooter": false,
"WIQLQueryBit": "AND [System.WorkItemType] NOT IN ('Test Suite', 'Test Plan', 'Shared Steps', 'Shared Parameter', 'Test Case')",
"WIQLOrderBit": "[System.ChangedDate] desc",
"LinkMigration": true,
"AttachmentMigration": false,
"AttachmentWorkingPath": "c:\\temp\\WorkItemAttachmentWorkingFolder\\",
"FixHtmlAttachmentLinks": false,
"SkipToFinalRevisedWorkItemType": true,
"WorkItemCreateRetryLimit": 5,
"FilterWorkItemsThatAlreadyExistInTarget": true,
"PauseAfterEachWorkItem": false,
"AttachmentMaxSize": 480000000,
"AttachRevisionHistory": false,
"LinkMigrationSaveEachAsAdded": false,
"GenerateMigrationComment": true,
"NodeBasePaths": [],
"WorkItemIDs": null,
"MaxRevisions": 5
}
],
"Endpoints": {
"TfsEndpoints": [
{
"Name": "IterationSettingsSource",
"AccessToken": "",
"Organisation": "http://<sourceServer>/DefaultCollection",
"Project": "<sourceProject>",
"ReflectedWorkItemIdField": "TfsMigrationTool.ReflectedWorkItemId",
"AuthenticationMode": "Prompt",
"AllowCrossProjectLinking": false,
"LanguageMaps": {
"Area": "Area",
"Iteration": "Iteration"
}
},
{
"Name": "IterationSettingsTarget",
"AccessToken": "",
"Organisation": "http://<targetServer>/DefaultCollection",
"Project": "<targetProject>",
"ReflectedWorkItemIdField": "ReflectedWorkItemId",
"AuthenticationMode": "Prompt",
"AllowCrossProjectLinking": false,
"LanguageMaps": {
"AreaPath": "Area",
"IterationPath": "Iteration"
}
}
],
"TfsTeamSettingsEndpoints": [
{
"Name": "TeamSettingsSource",
"AccessToken": "",
"Organisation": "http://<sourceServer>/DefaultCollection",
"Project": "<sourceProject>",
"ReflectedWorkItemIdField": "TfsMigrationTool.ReflectedWorkItemId",
"AuthenticationMode": "Prompt",
"AllowCrossProjectLinking": false,
"LanguageMaps": {
"Area": "Area",
"Iteration": "Iteration"
}
},
{
"Name": "TeamSettingsTarget",
"AccessToken": "",
"Organisation": "http://<targetServer>/DefaultCollection",
"Project": "<targetProject>",
"ReflectedWorkItemIdField": "ReflectedWorkItemId",
"AuthenticationMode": "Prompt",
"AllowCrossProjectLinking": false,
"LanguageMaps": {
"AreaPath": "Area",
"Iteration": "Iteration"
}
}
]
}
}
This was probably caused by a bug.
Discussion and possible solution is found here:
https://github.com/nkdAgility/azure-devops-migration-tools/issues/964

how to make a editable form. Using vue form generator

Here I have used vue form generator. where I have written components for real Estate form where I have all the input fields. So this is a normal form and i want to make this component and schema as update form like if user clicks on edit button and He is able to edit the form. SO i want make this components as editable form. SO if anyone have an idea please let me know.
vue form generator
<div>
<vue-form-g :schema="schema_Real_Estate:" :model="model" :options="formOptions"></vue-form-g>
<span class="prev_next">
<button class="prev_next_btn" #click.prevent="prev()">Previous</button>
<button class="prev_next_btn"#click.prevent="next()">Next</button>
</span>
</div>
new Vue({
el: '#q-vikreya',
components: {
"vue-form-g": VueFormGenerator.component
},
data() {
return {
model: {
Basement:'',
Bedrooms:'',
SQFT:'',
Lotsize:'',
TotalRooms:'',
Stories:'',
YearBuilt:'',
HOA:'',
Garages:'',
Roof:'',
Exterior:'',
Cooling:'',
Heating:'',
Elementary_school:'',
Middle_school:'',
High_school:'',
},
schema_Real_Estate: {
fields: [{
type: "input",
inputType: "number",
placeholder: "Bedrooms",
model: "Bedrooms",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "number",
placeholder: "Bathrooms",
required: true,
model: "Bathrooms",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "number",
placeholder: "SQFT",
required: true,
min: 18,
model: "SQFT",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "number",
placeholder: "Lot size",
required: true,
min: 18,
model: "Lotsize",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "number",
placeholder: "Total rooms",
required: true,
min: 18,
model: "TotalRooms",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "number",
placeholder: "Stories",
required: true,
min: 18,
model: "Stories",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "number",
placeholder: "Year Built",
required: true,
min: 18,
model: "YearBuilt",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "number",
placeholder: "HOA",
required: true,
min: 18,
model: "HOA",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "number",
placeholder: "Garages",
required: true,
min: 18,
model: "Garages",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Basement",
required: true,
min: 18,
model: "Basement",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Roof",
required: true,
min: 18,
model: "Roof",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Exterior",
required: true,
min: 18,
model: "Exterior",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Cooling",
required: true,
min: 18,
model: "Cooling",
styleClasses: ["half-width col-xs-12 col-sm-6", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Heating",
required: true,
min: 18,
model: "Heating",
styleClasses: ["half-width col-xs-12 col-sm-6", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "Elementary school",
required: true,
min: '',
model: "Elementary_school",
styleClasses: ["half-width col-xs-12 col-sm-4", "job_title"]
}, {
type: "input",
inputType: "text",
placeholder: "Middle school",
required: true,
min: '',
model: "Middle_school",
styleClasses: ["half-width col-xs-12 col-sm-4", "Experience"]
}, {
type: "input",
inputType: "text",
placeholder: "High school",
required: true,
min: '',
model: "High_school",
styleClasses: ["half-width col-xs-12 col-sm-4", "job_title"]
}]
},
methods: {
prev(currentStep) {
if(this.checkForm()) {
if (currentStep === 4) {
this.step = 3
} else {
this.step--;
}
}
},
onlyForCurrency ($event) {
// console.log($event.keyCode); //keyCodes value
let keyCode = ($event.keyCode ? $event.keyCode : $event.which);
// only allow number and one dot
if ((keyCode < 48 || keyCode > 57) && (keyCode !== 46 || this.price.indexOf('.') != -1)) { // 46 is dot
$event.preventDefault();
}
// restrict to 2 decimal places
if(this.price!=null && this.price.indexOf(".")>-1 && (this.price.split('.')[1].length > 1)){
$event.preventDefault();
}
},
next(currentStep) {
if(this.checkForm()) {
if (currentStep === 4) {
this.step = 5
} else {
this.step++;
}
},
<!--By using checkForm function we are preventing the form to navigate next screen until all the fields are-->
<!--filled completely-->
checkForm: function (e) {
if (this.category && this.title && this.address && this.city && this.state && this.price && this.description) {
return true;
}
this.errors = [];
if (!this.category) {
this.errors.push('Name required.');
}
if (!this.title) {
this.errors.push('Age required.');
}
if (!this.address) {
this.errors.push('Age required.');
}
if (!this.city) {
this.errors.push('Age required.');
}
if (!this.state) {
this.errors.push('Age required.');
}
if (!this.price) {
this.errors.push('Age required.');
}
if (!this.description) {
this.errors.push('Age required.');
}
if (!this.description) {
this.errors.push('Age required.');
}
if (!this.model) {
this.errors.push('Age required.');
}
e.preventDefault();
},
<!--This submitForm is the function used for submitting the post Ad form-->
submitForm: function(){
axios({
method : "POST",
url: "{% url 'PostAd' %}", //django path name
headers: {'X-CSRFTOKEN': '{{ csrf_token }}', 'Content-Type': 'application/json'},
data : {"category":this.category, "title":this.title,
"address":this.address,
"city": this.city,
"state": this.state,
"zip": this.zip,
"price": this.price,
"description": this.description,
"radio_price": this.radio_price,
"Job_title": this.model,
},//data
}).then(response => {
localStorage.clear();
console.log("response");
console.log(response.data);
this.success_msg = response.data['msg'];
window.location.replace('{% url "classifieds" %}') // Replace home by the name of your home view
}).catch(err => {
this.err_msg = err.response.data['err'];
console.log("response1");
console.log(err.response.data);
});
},
},
})

Mapping of a field with date change the date on target

I'm trying to map the field with date, but on the target the date is changed to previous date.
On the source:
Integration Date: 30.11.2019 00:00
On the target:
Integration Date: 29.11.2019 23:00
I was trying also with Regexp mapping, just to map the date, but was not able to make it working. Below there is my configuration. It's a migration from Azure Devops Services to Azure Devops Services.
{
"ChangeSetMappingFile": null,
"Source": {
"$type": "TfsTeamProjectConfig",
"Collection": "https://dev.azure.com/XXX",
"Project": "Reach CSA",
"ReflectedWorkItemIDFieldName": "ReflectedWorkItemId",
"AllowCrossProjectLinking": true,
"AuthenticationMode": "Prompt",
"PersonalAccessToken": "XXX",
"LanguageMaps": {
"AreaPath": "Area",
"IterationPath": "Iteration"
}
},
"Target": {
"$type": "TfsTeamProjectConfig",
"Collection": "https://dev.azure.com/XXX",
"Project": "ReachCSA-Migration-DryRun",
"ReflectedWorkItemIDFieldName": "ReflectedWorkItemId",
"AllowCrossProjectLinking": true,
"AuthenticationMode": "Prompt",
"PersonalAccessToken": "XXX",
"LanguageMaps": {
"AreaPath": "Area",
"IterationPath": "Iteration"
}
},
"GitRepoMapping": null,
"LogLevel": "Verbose",
"FieldMaps": [
{
"$type": "FieldtoFieldMultiMapConfig",
"WorkItemTypeName": "*",
"SourceToTargetMappings": {
"CSAReach.Rationale": "Rationale",
"System.Reason": "ReachCSA_Reason",
"CSAReach.TargetRelease": "ReachCSA Target Release",
"CSAReach.Source": "ReachCSA_Origin_Source",
"CSAReach.Contact1": "Contact 1",
"CSAReach.Contact2": "Contact 2",
"CSAReach.Contact3": "Contact 3",
"Microsoft.VSTS.Common.Priority": "ReachCSA_Priority",
"CSAReach.RequirementType": "ReachCSA_Type",
"CSAReach.Target": "Target Platform",
"CSAReach.IntegrationDate": "Integration Date",
"CSAReach.MarketDate": "Market Date"
}
},
{
"$type": "FieldtoFieldMultiMapConfig",
"WorkItemTypeName": "Query",
"SourceToTargetMappings": {
"CSAReach.SystemInfo": "System Information",
"Microsoft.VSTS.TCM.ReproSteps": "Steps to Reproduce",
"System.Reason": "ReachCSA_Reason",
"CSAReach.Source": "ReachCSA_Origin_Source",
"CSAReach.Contact1": "Contact 1",
"CSAReach.Contact2": "Contact 2",
"CSAReach.Contact3": "Contact 3",
"Microsoft.VSTS.Common.Priority": "ReachCSA_Severity",
"CSAReach.Target": "Target Platform",
"CSAReach.DueDate": "Due Date",
"CSAReach.FoundInRelease": "CSA Release"
}
}
],
"Processors": [
{
"$type": "WorkItemMigrationConfig",
"Enabled": true,
"ReplayRevisions": true,
"PrefixProjectToNodes": false,
"UpdateCreatedDate": true,
"UpdateCreatedBy": true,
"BuildFieldTable": false,
"AppendMigrationToolSignatureFooter": false,
"WIQLQueryBit": "AND [System.Id] IN ('42249')",
"WIQLOrderBit": "[System.ChangedDate] desc",
"LinkMigration": true,
"AttachmentMigration": true,
"AttachmentWorkingPath": "D:\\Workspaces\\projects\\PG-CT migration\\ReachCSA\\attachments\\",
"FixHtmlAttachmentLinks": false,
"SkipToFinalRevisedWorkItemType": true,
"WorkItemCreateRetryLimit": 5,
"FilterWorkItemsThatAlreadyExistInTarget": true,
"PauseAfterEachWorkItem": false,
"AttachmentMaxSize": 480000000,
"CollapseRevisions": false,
"LinkMigrationSaveEachAsAdded": false,
"GenerateMigrationComment": true
}
],
"Version": "11.9",
"workaroundForQuerySOAPBugEnabled": false,
"WorkItemTypeDefinition": {
"sourceWorkItemTypeName": "targetWorkItemTypeName"
}
}
Thanks for any help!
OK, got the issue here. It's time settings between the azure organization (UTC) and my profile. The profile needs to be set to my local timezone.