Skip to main content

Posts

Angular 9 ngForm, ngNoForm and Template Reference Variables

What is Angular NgForm

It's simply a directive exported from FormsModule which gets automatically added to all <form> tags in your Angular templates once you import the module.

Behind the curtains, the ngForm directive creates a top-level FormGroup instance and binds it to your <form> tag to enable you to work with the form. For example to access the aggregate form value or check validation status.
How to Access Angular NgForm Using Template Reference Variables

Since the ngForm directive is implicitly added in your <form> tag when you import its parent module (FormsModule) in your application, you don't need to do any configuration to start working with template-based forms.

You can simply get a reference to your form' ngForm directive by exporting it into a local template variable and by using the ngForm directive as the value of the variable (#myForm=ngForm).

Using Angular ngNoForm If you you want to import FormsModule in your application but want to skip …
Recent posts

how to add angular material in angular 9

Step 1: First go to the project (inside the project folder) run the following command.

Mukeshs-MacBook-Air:angular-matrial-project mukeshchoudhary$ ng add @angular/material ?Would you like to share anonymous usage data about this project with the Angular Team at Google under Google’s Privacy Policy at https://policies.google.com/privacy? For more details and how to change this setting, see http://angular.io/analytics.Yes
Thank you for sharing anonymous usage data. Would you change your mind, the following command will disable this feature entirely:
ng analytics project off
Installing packages for tooling via npm. Installed packages for tooling via npm. ?Choose a prebuilt theme name, or "custom" for a custom theme:Indigo/Pink[ Preview: https://material.angular.io?theme=indigo-pink ] ?Set up global Angular Material typography styles?Yes ?Set up browser animations for Angular Material?Yes UPDATE package.json (1364 bytes) ✔ Packages installed successfully. UPDATE src/app/app.module.ts (502 by…

how to create first angular project

Steps 1 : First Go to your destination folder where you want to create a project :

Step 2: Then run the below command : ng new name_of_project

Mukeshs-MacBook-Air:ANGULAR-MATRIAL mukeshchoudhary$ ng new angular-matrial-project
?Would you like to add Angular routing?Yes ?Which stylesheet format would you like to use?CSS CREATE angular-matrial-project/README.md (1038 bytes) CREATE angular-matrial-project/.editorconfig (246 bytes) CREATE angular-matrial-project/.gitignore (631 bytes) CREATE angular-matrial-project/angular.json (3703 bytes) CREATE angular-matrial-project/package.json (1300 bytes) CREATE angular-matrial-project/tsconfig.json (489 bytes) CREATE angular-matrial-project/tslint.json (1953 bytes) CREATE angular-matrial-project/browserslist (429 bytes) CREATE angular-matrial-project/karma.conf.js (1035 bytes) CREATE angular-matrial-project/tsconfig.app.json (210 bytes) CREATE angular-matrial-project/tsconfig.spec.json (270 bytes) CREATE angular-matrial-project/src/favicon.ico (948 bytes) CREA…

how to share your existing project to AWS code commit.

Step 1: First Create a Local Repository in Eclipse by Opening Git Repositories Tabs or Perspective
Right Click on

Step 2: Go to AWS Codecommit and create a folder or repository there and clone https URL from there.


Now Past this URL in step first.

While pasting it will ask for username and password for that you need to create a IAM user and need to assign a role to user and then you have to create creational for him.

Now you local repos and remote repo is ready.

Step 3: Now go to your project and right-click and in team section click on Share Project > Git > Next >. Choose Your Repository from Local Machine. > Finish.


Step 4: Now right-click on Project > Team> Add to Index.

Step 5 : Now right-click on Project > Team > Commit > Choose files and Click on Commit and Push.





How do I allow access to an Amazon S3 bucket only from a CloudFront distribution?

Step 1: Frist login into your account and create a bucket in s3 like cloud.example.com
Step 2 : Go to CloudFront Service

Amazon CloudFront Getting Started Either your search returned no results, or you do not have any distributions. Click the button below to create a new CloudFront distribution. A distribution allows you to distribute content using a worldwide network of edge locations that provide low latency and high data transfer speeds (learn more) Create Distribution

Now click on Create Distribution and you have to choose Web Distribution from Below


Select a delivery method for your content. Web Create a web distribution if you want to:
Speed up distribution of static and dynamic content, for example, .html, .css, .php, and graphics files.Distribute media files using HTTP or HTTPS.Add, update, or delete objects, and submit data from web forms.Use live streaming to stream an event in real time. You store your files in an origin - either an Amazon S3 bucket or a web server. After yo…