ngx-translate: Translate strings in html

Source: https://stackoverflow.com/questions/50027311/ngx-translate-translate-strings-in-html

<label for="user-terms" [innerHTML]="'i-agree' | translate: {termLink: 'javascript:void(0)'}"></label>

This is how you can use parametric translation with filters:

// define translation with parameter
'TRANSLATION_KEY': '{{days}} days'

// use it in template
<span>{{ 'TRANSLATION_KEY' | translate: { days: followUpInDays | positiveNumber } }}</span>

If you want to have the whole sentence as a translation (including the HTML), you will need to use innerHTML property binding:

// define translation with parameter
'TRANSLATION_KEY': 'Follow-up is <span class="{{className}}">{{days}} days</span> past due'

// use it in template
<span *ngIf="Days < 0 && !shortSentence"
      [innerHTML]="'TRANSLATION_KEY' | translate: { className: (highlightContent ? 'font-bold' : ''), days: followUpInDays | positiveNumber }"> </span>

RegEx Ignore Case

Source: https://stackoverflow.com/questions/24395542/regex-ignore-case/36593305

Flags go at the end.

/regex/i

i is for case-Insensitive (or ignore-case)

When should I use UNSIGNED and SIGNED INT in MySQL?

Source: https://stackoverflow.com/questions/11515594/when-should-i-use-unsigned-and-signed-int-in-mysql

UNSIGNED only stores positive numbers (or zero). On the other hand, signed can store negative numbers (i.e., may have a negative sign).

Here's a table of the ranges of values each INTEGER type can store:

^{Source: http://dev.mysql.com/doc/refman/5.6/en/integer-types.html}

UNSIGNED ranges from 0 to n, while signed ranges from about -n/2 to n/2.

In this case, you have an AUTO_INCREMENT ID column, so you would not have negatives. Thus, use UNSIGNED. If you do not use UNSIGNED for the AUTO_INCREMENT column, your maximum possible value will be half as high (and the negative half of the value range would go unused).

Angular dropdown change

Source: https://stackoverflow.com/questions/33700266/how-can-i-get-new-selection-in-select-in-angular-2

If you don't need two-way data-binding:

<select (change)="onChange($event.target.value)">
    <option *ngFor="let i of devices">{{i}}</option>
</select>

onChange(deviceValue) {
    console.log(deviceValue);
}

For two-way data-binding, separate the event and property bindings:

<select [ngModel]="selectedDevice" (ngModelChange)="onChange($event)" name="sel2">
    <option [value]="i" *ngFor="let i of devices">{{i}}</option>
</select>

export class AppComponent {
  devices = 'one two three'.split(' ');
  selectedDevice = 'two';
  onChange(newValue) {
    console.log(newValue);
    this.selectedDevice = newValue;
    // ... do other stuff here ...
}

---

If devices is array of objects, bind to ngValue instead of value:

<select [ngModel]="selectedDeviceObj" (ngModelChange)="onChangeObj($event)" name="sel3">
  <option [ngValue]="i" *ngFor="let i of deviceObjects">{{i.name}}</option>
</select>
{{selectedDeviceObj | json}}

export class AppComponent {
  deviceObjects = [{name: 1}, {name: 2}, {name: 3}];
  selectedDeviceObj = this.deviceObjects[1];
  onChangeObj(newObj) {
    console.log(newObj);
    this.selectedDeviceObj = newObj;
    // ... do other stuff here ...
  }
}

Mysql Order NULL value

Source: https://www.designcise.com/web/tutorial/how-to-order-null-values-first-or-last-in-mysql

In MySQL NULL values are considered lower than any non-NULL value, therefore, NULL values appear first when the order is ASC (ascending), and ordered last when the order is DESC (descending)

Sort In Ascending Order With NULLs Last

Using The Minus Operator:

In MySQL NULL values are considered lower in order than any non-NULL value, except if a - (minus) character is added before the column name while sorting.

Query:

SELECT * FROM user 

ORDER BY -date_login DESC

While this may work well for numbers and dates, it may not be the best solution to sort fields with alpha or alphanumeric values, for those you may want to try the other methods discussed in this article.

Shadow DOM

Source: https://dzone.com/articles/what-is-viewencapsulation-in-angular

Simply put, the Shadow DOM brings Encapsulation to HTML Elements. Using the Shadow DOM, markup, styles, and behaviors are scoped to the element and do not clash with other nodes of the DOM. The Shadow DOM is part of Web Components, which encapsulates styles and login of the element.

Angular Reset form and keep default values

Source: https://stackoverflow.com/questions/42121794/resetting-form-and-set-default-value-angular-2

Use form.reset:

form.reset({ id: this.id });

---

Original answer (valid for angular@2)

You can pass a value to resetForm which will be used as a default value for the form:

form.resetForm({ id: this.id });

(of course if your form is a FormGroup and it has a control with the name id which should have a default value)