Skip to content

Commit 09bec82

Browse files
FawzyMokhtarFawzyMokhtar
committed
Complete getting-started post
Add validator-class, validation-error-class & validation-result-class posts
1 parent 41fc641 commit 09bec82

19 files changed

Lines changed: 499 additions & 17 deletions

‎src/app/shared/components/post-section-navigator/post-section-navigator.component.html‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
<nav class="navbar">
22
<div class="nav-item">
3-
<a *ngFor="let section of sections" [routerLink]="route" [fragment]="section.id"
4-
class="nav-link">{{section.title}}</a>
3+
<a *ngFor="let section of sections" [routerLink]="route" [fragment]="section.id" class="nav-link">
4+
<ng-container *ngIf="section.isCode; else nonCode">
5+
<span><code>{{section.title}}</code></span>
6+
</ng-container>
7+
<ng-template #nonCode>{{section.title}}</ng-template>
8+
</a>
59
</div>
610
</nav>

‎src/app/shared/data/versions.data.ts‎

Lines changed: 69 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,75 @@ export const Versions: IVersion[] = [
3838
route: resolveRoute(VERSIONS["1.0.0"], "getting-started"),
3939
sections: [
4040
{
41-
id: "section1",
42-
title: "Section 1"
41+
id: "installation",
42+
title: "Installation"
43+
},
44+
{
45+
id: "basic-guid",
46+
title: "Basic guid"
47+
}
48+
]
49+
}
50+
]
51+
},
52+
{
53+
title: "Name-Space",
54+
posts: [
55+
{
56+
id: "validator-class",
57+
title: "Validator Class",
58+
route: resolveRoute(VERSIONS["1.0.0"], "validator-class"),
59+
sections: [
60+
{
61+
id: "members",
62+
title: "Members"
63+
},
64+
{
65+
id: "create",
66+
title: "Create(model, \"propertyName\")",
67+
isCode: true
68+
}
69+
]
70+
},
71+
{
72+
id: "validation-error-class",
73+
title: "ValidatorError Class",
74+
route: resolveRoute(VERSIONS["1.0.0"], "validation-error-class"),
75+
sections: [
76+
{
77+
id: "members",
78+
title: "Members"
79+
},
80+
{
81+
id: "property-name",
82+
title: "PropertyName",
83+
isCode: true
84+
},
85+
{
86+
id: "error-messages",
87+
title: "ErrorMessages",
88+
isCode: true
89+
}
90+
]
91+
},
92+
{
93+
id: "validation-result-class",
94+
title: "ValidatorResult Class",
95+
route: resolveRoute(VERSIONS["1.0.0"], "validation-result-class"),
96+
sections: [
97+
{
98+
id: "members",
99+
title: "Members"
100+
},
101+
{
102+
id: "validate",
103+
title: "Validate(validators)",
104+
isCode: true
105+
},
106+
{
107+
id: "result",
108+
title: "Result(validators)",
109+
isCode: true
43110
}
44111
]
45112
}

‎src/app/shared/models/post-section-item.model.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,4 +13,9 @@ export interface IPostSectionItem {
1313
* The title of the section.
1414
*/
1515
title: string;
16+
17+
/**
18+
* Indicates whether is the title property is a code or not
19+
*/
20+
isCode?: boolean;
1621
}

‎src/app/version1.0.0/components/getting-started/getting-started.component.html‎

Lines changed: 45 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,20 @@
44
<ng-container class="article">
55
<p>
66
DotNet Validator is a <a href="https://dotnet.microsoft.com/" target="blank">.NET</a> library
7-
that contains a set of utility methods which could be used to validate or
8-
<a href="https://medium.com/@abderrahman.hamila/what-sanitize-mean-and-why-sanitize-in-code-data-5c68c9f76164"
9-
target="blank">
10-
sanitize
11-
</a>
7+
that contains a set of utility methods which could be used to <code>validate </code> or
8+
<code>
9+
<a href="https://medium.com/@abderrahman.hamila/what-sanitize-mean-and-why-sanitize-in-code-data-5c68c9f76164"
10+
target="blank">
11+
sanitize
12+
</a>
13+
</code>
1214
<a href="https://dotnet.microsoft.com/" target="blank">.NET</a> data-models.
1315
</p>
1416
<div>
15-
<h2>Installation</h2>
17+
<h2 class="section-heading">
18+
Installation
19+
<a id="installation" aria-hidden="true" class="section-heading-ref"></a>
20+
</h2>
1621
<p>
1722
DotNet Validator is a portable
1823
<a href="https://docs.microsoft.com/en-us/dotnet/standard/net-standard" target="blank">
@@ -53,13 +58,46 @@ <h3>Install using: </h3>
5358
</ul>
5459
</div>
5560
<div>
56-
<h2>Basic guid</h2>
61+
<h2 class="section-heading">
62+
Basic guid
63+
<a id="basic-guid" aria-hidden="true" class="section-heading-ref"></a>
64+
</h2>
5765
<p>
5866
Let's start with creating a new class called <code>Person</code>.
5967
</p>
6068
<pre class="code-block">
6169
<code appHighlight>{{person1}}</code>
6270
</pre>
71+
<p>
72+
Then create an object from the <code>Person</code> class.
73+
</p>
74+
<pre class="code-block">
75+
<code appHighlight>{{personObj1}}</code>
76+
</pre>
77+
<p>
78+
Now let's validate the model so that the <code>Age</code> value
79+
should be at least <strong>18</strong> years old.
80+
</p>
81+
<p>First we should add DotNet Validator library to our using area.</p>
82+
<pre class="code-block">
83+
<code appHighlight>{{usingLib}}</code>
84+
</pre>
85+
<pre class="code-block">
86+
<code appHighlight>{{personValidate1}}</code>
87+
</pre>
88+
<p>
89+
Let's put all code together.
90+
</p>
91+
<pre class="code-block">
92+
<code appHighlight>{{personValidateWithError1}}</code>
93+
</pre>
94+
<p>
95+
Or you can use the other method <code>Result()</code> to get a <code>dynamic</code> errors
96+
<code>object</code>.
97+
</p>
98+
<pre class="code-block">
99+
<code appHighlight>{{personValidateResult1}}</code>
100+
</pre>
63101
</div>
64102
</ng-container>
65103
<!-- End Article -->

‎src/app/version1.0.0/components/getting-started/getting-started.component.ts‎

Lines changed: 64 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,71 @@ export class GettingStartedComponent implements OnInit {
1717

1818
//#region Codes
1919
person1 = `
20-
public class Person {
21-
public string Name {get; set;}
22-
public int Age {get; set;}
20+
public class Person
21+
{
22+
public string Name { get; set; }
23+
public int Age { get; set; }
2324
}`;
25+
26+
personObj1 = `
27+
var data = new Person
28+
{
29+
Name = "John Smith",
30+
Age = 17
31+
};`;
32+
33+
usingLib = `
34+
using DotNetValidator;`;
35+
36+
personValidate1 = `
37+
/*
38+
the static class Validator include a static method called
39+
create(object dataModel, string propertyName)
40+
*/
41+
var validator = Validator.Create(data, "Age")
42+
/*
43+
Then we call a validation method called
44+
Min(double minValue, optional string errorMessage)
45+
*/
46+
.Min(18, "Person age must be at least 18 years old.");
47+
48+
/*
49+
call the Validate() method to get the validation errors
50+
*/
51+
var errors = validator.Validate();`;
52+
53+
personValidateWithError1 = `
54+
${this.personObj1}
55+
56+
var validator = Validator.Create(data, "Age")
57+
.Min(18, "Person age must be at least 18 years old.");
58+
59+
var errors = validator.Validate();
60+
61+
/*
62+
errors value will be a List<ValidationError>
63+
64+
[
65+
{
66+
Age = [
67+
"Person age must be at least 18 years old."
68+
]
69+
}
70+
]
71+
*/`;
72+
73+
personValidateResult1 = `
74+
var errors = validator.Result();
75+
76+
/*
77+
errors value will be a dynamic object
78+
79+
{
80+
Age = [
81+
"Person age must be at least 18 years old."
82+
]
83+
}
84+
*/`;
2485
//#endregion
2586

2687
ngOnInit(): void {

‎src/app/version1.0.0/components/index.ts‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,16 @@
11
import {GettingStartedComponent} from "./getting-started/getting-started.component";
2+
import {ValidatorClassComponent} from "./validator-class/validator-class.component";
3+
import {ValidationErrorClassComponent} from "./validation-error-class/validation-error-class.component";
4+
import {ValidationResultClassComponent} from "./validation-result-class/validation-result-class.component";
25

36
export * from "./getting-started/getting-started.component";
7+
export * from "./validator-class/validator-class.component";
8+
export * from "./validation-error-class/validation-error-class.component";
9+
export * from "./validation-result-class/validation-result-class.component";
410

511
export const COMPONENTS: any[] = [
6-
GettingStartedComponent
12+
GettingStartedComponent,
13+
ValidatorClassComponent,
14+
ValidationErrorClassComponent,
15+
ValidationResultClassComponent
716
];

‎src/app/version1.0.0/components/validation-error-class/validation-error-class.component.html‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<app-post *ngIf="post" [post]="post" [previous]="previous" [next]="next">
2+
3+
<!-- Article -->
4+
<ng-container class="article">
5+
<p>
6+
A <code>public class ValidationError</code> that resulting from validating a given Property under a specific
7+
data model
8+
against all validation roles associated with it.
9+
</p>
10+
<div>
11+
<h2 class="section-heading">
12+
Members
13+
<a id="members" aria-hidden="true" class="section-heading-ref"></a>
14+
</h2>
15+
<ul>
16+
<li>
17+
<h3>
18+
<code>PropertyName</code>
19+
<a id="property-name" aria-hidden="true" class="section-heading-ref"></a>
20+
</h3>
21+
<p>
22+
A <code>public property</code> that gets the property name for which the validator was
23+
generated.
24+
</p>
25+
</li>
26+
<li>
27+
<h3>
28+
<code>ErrorMessages</code>
29+
<a id="error-messages" aria-hidden="true" class="section-heading-ref"></a>
30+
</h3>
31+
<p>
32+
A <code>public property</code> that gets the list of validation error messages resulting from
33+
validating the current model's
34+
<code>PropertyName</code>
35+
against all the validation roles.
36+
</p>
37+
<h3>Returns :</h3>
38+
<ul>
39+
<li>
40+
A <code>List&lt;string&gt;</code>.
41+
</li>
42+
</ul>
43+
</li>
44+
</ul>
45+
</div>
46+
</ng-container>
47+
<!-- End Article -->
48+
49+
</app-post>

‎src/app/version1.0.0/components/validation-error-class/validation-error-class.component.sass‎

Whitespace-only changes.

‎src/app/version1.0.0/components/validation-error-class/validation-error-class.component.ts‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import {Component, OnInit} from "@angular/core";
2+
import {IPost, DocService} from "../../../shared";
3+
4+
@Component({
5+
selector: "app-validation-error-class",
6+
templateUrl: "./validation-error-class.component.html",
7+
styleUrls: ["./validation-error-class.component.sass"]
8+
})
9+
export class ValidationErrorClassComponent implements OnInit {
10+
11+
versionId = "1.0.0";
12+
postId = "validation-error-class";
13+
14+
post: IPost;
15+
previous: IPost;
16+
next: IPost;
17+
18+
ngOnInit(): void {
19+
this.post = DocService.findPost(this.versionId, this.postId);
20+
21+
const prevNext = DocService.GetPrevNextPosts(this.versionId, this.postId);
22+
this.previous = prevNext.previous;
23+
this.next = prevNext.next;
24+
}
25+
26+
}

0 commit comments

Comments
 (0)