Protected: Angular: template url

This content is password protected. To view it please enter your password below:

Advertisements
0

Angular: CORS and PolyFils.ts

This helps with CORS issues on Angular within the browser during development
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* file.
*
* The current setup is for so-called “evergreen” browsers; the last versions of browsers that
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
*
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import ‘core-js/es6/symbol’;
import ‘core-js/es6/object’;
import ‘core-js/es6/function’;
import ‘core-js/es6/parse-int’;
import ‘core-js/es6/parse-float’;
import ‘core-js/es6/number’;
import ‘core-js/es6/math’;
import ‘core-js/es6/string’;
import ‘core-js/es6/date’;
import ‘core-js/es6/array’;
import ‘core-js/es6/regexp’;
import ‘core-js/es6/map’;
import ‘core-js/es6/weak-map’;
import ‘core-js/es6/set’;
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import ‘classlist.js’; // Run `npm install –save classlist.js`.
/** IE10 and IE11 requires the following to support `@angular/animation`. */
import ‘web-animations-js’; // Run `npm install –save web-animations-js`.
/** Evergreen browsers require these. **/
import ‘core-js/es6/reflect’;
import ‘core-js/es7/reflect’;
/** ALL Firefox browsers require the following to support `@angular/animation`. **/
// import ‘web-animations-js’; // Run `npm install –save web-animations-js`.
/***************************************************************************************************
* Zone JS is required by Angular itself.
*/
import ‘zone.js/dist/zone’; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/
/**
* Date, currency, decimal and percent pipes.
* Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
*/
import ‘intl’; // Run `npm install –save intl`.
/**
* Need to import at least one locale-data with intl.
*/
import ‘intl/locale-data/jsonp/en’;
0

Angular: Auto complete default select

import { Component } from ‘@angular/core’;

@Component({
selector: ‘my-app’,
templateUrl: ‘app/app.template.html’
})
export class AppComponent {

customer = {“id”: 1, “name”: “Smith”, “firstname”: “John”}; <– sets default

customers = [
{“id”: 1, “name”: “Smith”, “firstname”: “John”},
{“id”: 2, “name”: “Doe”, “firstname”: “John”},
{“id”: 3, “name”: “Smith”, “firstname”: “Jane”}
];
customerResults: Array = [];

searchCustomers(event): void {
this.customerResults = this.customers.filter(c => c.name.startsWith(event.query));
}
}

0

Angular 4 Tricks

Modify the background in html and how to set image src using Angular 4

 

<div>
<div>
<divclass="ui-g-12 ui-md-12 " [ngStyle]="{'background-image': getUrl(), 'background-size': 'contain'}"></div>
<div></div>
</div>
<div>
<div><img [src]="net1Image"></div>
</div>
0

Angular: Grab Form Data

</div>
</div>
<div>
<div>
<div><p-dialog header="Edit comment" [(visible)]="displayDialog" [responsive]="true" showEffect="fade" [modal]="true" [closable]="false"></div>
<div><form [formGroup]="editCommentLogForm"></div>
<div>
<divclass="ui-grid ui-grid-responsive ui-fluid"></div>
<div></div>
<div>
<divclass="ui-grid-row"></div>
<div></div>
<div></div>
<div><textarearows="5"cols="100"pInputTextareaautoResize="autoResize"id="commentLogMessage"formControlName="commentLogMessage" [ngModel]="selectedComment.comment"></textarea></div>
<div></div>
<div></div>
</div>
<div></div>
<div></div>
<div></div>
</div>
<div></div>
<div><p-footerclass="modal-footer"></div>
<div>
<divclass="ui-dialog-buttonpane ui-helper-clearfix"></div>
<div><buttontype="button"pButtonicon="fa-check" (click)="saveComment(selectedComment)"label="Save"></button> or <spanclass="cancel-button" (click)="cancel()">Cancel</span></div>
<div></div>
</div>
<div></p-footer></div>
<div></form></div>
<div></p-dialog></div>
</div>
</div>
<div>
</div>
<div>
<div>
<div>saveComment(comment:CommentLog){</div>
<div>letformData=this.editCommentLogForm.value;</div>
<div>letformComment=formData['commentLogMessage'];</div>
<div>comment.comment=formComment</div>
<div>}</div>
</div>
</div>
</div>
<div>
</div>
<div>[ngModel]="selectedComment.comment" == only pulls data</div>
<div></div>
<div>[(ngModel)]="selectedComment.comment == pulls and can update data</div>
<div>
<div>
<div>