Angular2 Tricks

Hi Friends welcome, in this section, I will introduce you with some of the tips and tricks of Angular2. That I came across while doing my handsfree with AngularJS2. I hope these information's will help you.

💭What if I will use both template and templateUrl field in my Component? Is it going to through me Error, if not then which field will get considered?
      Ex :
@Component({
  selector: 'banchha',
  template:` <h1>Testing template attribute</h1>  `,
  templateUrl: './app.component.html'
})
💨 The answer is that you can use both of them in the Component, it might be logically not correct but syntactically Angular2 allows it(as on 1st May 2017), so no error will be thrown by the transpiler.

Answering next which field will be considered, the answer is that the field(between template and templateUrl) that occurs last in the Component,  will get considered, i:e in above example the templateUrl comes later so it will be considered.

Comments

Post a Comment

Popular posts from this blog

Tutorial-6 Pipes

Image
Pipes We describe Angular Pipes as it provides a way to format the Data in your html template, without putting a lot of efforts in your program for displaying some data in some specific format angular gives us power of Pipes. Pipes can be used within the Interpolation Expression for showing the formatted output. We use Pipe Operator i:e : I for availing the pipe facility, followed by the required pipe name. Syntax : {{dataModel | pipe name}} Ex : <p>Date of joining is{{joinDate | date}}</p> Parameterized Pipe: Pipes can take further formatting options with the help of parameters, parameters are represented by : (Colon) and placed after the pipe names. Syntax: {{dataModel | pipe name:parameter}} Ex : <p>Date of joining is{{joinDate | date:”MM/dd/YYYY”}}</p> Demonstrating uppercase and lowercase pipes App.cpmponent.ts import { Component } from '@angular/core' ; import { FormsModule } from '@angular/forms' ; ...
Read more

Tutorial-4 Data Bindings in Angular

Image
Data Bindings in Angular In this section we will discuss various ways to display data in view and fetching data from the view as well as how to sync the data between view and model. Remember to show data in the view we have to take help of the templates, because templates are responsible for rendering the HTML in the browser. Angular provides so many ways for achieving the data binding feature, lets discuss all of them with some suitable examples. Interpolation :{{…}} Interpolation refers to binding data with the help of curly brackets, i:e {{}}. We normally place the components property name in between the Open Curly Bracket {{ and close Curly Bracket }} . Synatx : {{component property name}} Ex: <p>Application Name is{{title}}</p> Remember anything you put in the Interpolation is known as Template Expression. And every Template Expression produces some value which can be used for, displaying data, assigning value to DOM properties and HTML attributes or ca...
Read more