Add special characters to text to print in color in the console (combined with console.log()).

Use template literals and special characters to add the appropriate color code to the string output.
For background colors, add a special character that resets the background color at the end of the string.

继续阅读 30秒学会 JavaScript 片段 – colorize

Removes zero values from a collection.

Use reflect.ValueOf() to get the array or slice, make() to make an appropriate slice.
Use a for loop with Value.Len() and Value.Index() to iterate over each element.
Use append() to add it to the resulting slice if Value.IsZero() is `false.

继续阅读 30秒学会 Golang 片段 – Compact

Under the hood Angular compiles structural directives into ng-template elements, e.g.:

<!-- This -->
<div *ngFor="let item of [1,2,3]">

<!-- Get expanded into this -->
<ng-template ngFor [ngForOf]="[1,2,3]" let-item="$implicit"></ng-template>

The value passed to *ngFor directive is written using microsyntax. You can learn about it in the docs.

Also check out an interactive tool that shows the expansion by Alexey Zuev

翻译自:https://www.30secondsofcode.org/angular/s/understanding-microsyntax

相关链接

Returns a customized coalesce function that returns the first argument that returns true from the provided argument validation function.

Use Array.prototype.find() to return the first argument that returns true from the provided argument validation function.

继续阅读 30秒学会 JavaScript 片段 – coalesceFactory

If the text is longer than one line, it will be truncated and end with an ellipsis .

  • overflow: hidden prevents the text from overflowing its dimensions (for a block, 100% width and auto height).
  • white-space: nowrap prevents the text from exceeding one line in height.
  • text-overflow: ellipsis makes it so that if the text exceeds its dimensions, it will end with an ellipsis.
  • width: 200px; ensures the element has a dimension, to know when to get ellipsis
  • Only works for single line elements.

继续阅读 30秒学会 CSS 片段 – Truncate text

Angular allows us to control the way module preloading is handled.

There are 2 strategies provided by @angular/router: PreloadAllModules and NoPreloading. The latter enabled by default, only preloading lazy modules on demand.

We can override this behavior by providing custom preloading strategy: In the example below we preload all included modules if the connection is good.

import { Observable, of } from 'rxjs';

export class CustomPreloading implements PreloadingStrategy {
  public preload(route: Route, load: () => Observable<any>): Observable<any> {
    return preloadingConnection() ? load() : of(null);
  }
}

const routing: ModuleWithProviders = RouterModule.forRoot(routes, {
  preloadingStrategy: CustomPreloading
});

Note that that the example above would not be very efficient for larger apps, as it’ll preload all the modules.

继续阅读 30秒学会 Angular 片段 – Router Custom Preloading