Add more form snippets

Author: stefnotch

CHANGELOG.md

@@ -4,6 +4,8 @@
 
 # 8.3.0 (2019-12-18)
 
+- Added `a-form` to create a form tag with ngSubmit and form attributes
+- Added `a-form-submit` to create a submit button for a form
 - Fixed `a-service` to create a service with injectable provided in root
 
 <a name="8.2.0"></a>

README.md

@@ -90,28 +90,30 @@ Alternatively, press `Ctrl`+`Space` (Windows, Linux) or `Cmd`+`Space` (OSX) to a
 
 ### HTML Snippets
 
-| Snippet              | Purpose                                    |
-| -------------------- | ------------------------------------------ |
-| `a-class`            | `[class]` binding                          |
-| `a-select`           | `<select>` control                         |
-| `a-style`            | `[style]` binding                          |
-| `a-ngClass`          | `ngClass`                                  |
-| `a-ngFor`            | `*ngFor`                                   |
-| `a-ngForAsync`       | `*ngFor` with async                        |
-| `a-ngFor-trackBy`    | `*ngFor` with trackBy                      |
-| `a-formArrayName`    | `formArrayName`                            |
-| `a-formControlName`  | `formControlName`                          |
-| `a-formGroup`        | `formGroup`                                |
-| `a-formGroupName`    | `formGroupName`                            |
-| `a-ngIf`             | `*ngIf`                                    |
-| `a-ngIfElse`         | `*ngIf` with `else`                        |
-| `a-ngModel`          | `ngModel`                                  |
-| `a-routerLink`       | `routerLink`                               |
-| `a-routerLink-param` | `routerLink` with a route parameter        |
-| `a-ngStyle`          | `ngStyle`                                  |
-| `a-ngSwitch`         | `ngSwitch`                                 |
-| `a-prej`             | show the JSON form of a model              |
-| `a-preja`            | show the JSON form of a model, using async |
+| Snippet              | Purpose                                             |
+| -------------------- | --------------------------------------------------- |
+| `a-class`            | `[class]` binding                                   |
+| `a-select`           | `<select>` control                                  |
+| `a-style`            | `[style]` binding                                   |
+| `a-ngClass`          | `ngClass`                                           |
+| `a-ngFor`            | `*ngFor`                                            |
+| `a-ngForAsync`       | `*ngFor` with async                                 |
+| `a-ngFor-trackBy`    | `*ngFor` with trackBy                               |
+| `a-form`             | create a form tag with ngSubmit and form attributes |
+| `a-formArrayName`    | `formArrayName`                                     |
+| `a-formControlName`  | `formControlName`                                   |
+| `a-formGroup`        | `formGroup`                                         |
+| `a-formGroupName`    | `formGroupName`                                     |
+| `a-form-submit`      | create a submit button for a form                   |
+| `a-ngIf`             | `*ngIf`                                             |
+| `a-ngIfElse`         | `*ngIf` with `else`                                 |
+| `a-ngModel`          | `ngModel`                                           |
+| `a-routerLink`       | `routerLink`                                        |
+| `a-routerLink-param` | `routerLink` with a route parameter                 |
+| `a-ngStyle`          | `ngStyle`                                           |
+| `a-ngSwitch`         | `ngSwitch`                                          |
+| `a-prej`             | show the JSON form of a model                       |
+| `a-preja`            | show the JSON form of a model, using async          |
 
 ### VS Code Snippets
 

snippets/html.json

@@ -29,6 +29,14 @@
     "body": ["*ngFor=\"let ${1:item} of ${2:stream} | async as ${3:list}\"${0}"],
     "description": "Angular *ngForAsync"
   },
+  "ngForm": {
+    "prefix": "a-form",
+    "body": [
+      "<form (ngSubmit)=\"onSubmit()\" #${1:form}=\"ngForm\">",
+      "</form>"
+    ],
+    "description": "Form with ngSubmit and form attributes"
+  },
   "ngFormArrayName": {
     "prefix": "a-formArrayName",
     "body": [
@@ -57,6 +65,15 @@
     ],
     "description": "Angular formGroupName"
   },
+  "ngFormSubmit": {
+    "prefix": "a-form-submit",
+    "body": [
+      "<button type=\"submit\" [disabled]=\"!${1:form}.form.valid\">",
+      "\tSave",
+      "</button>"
+    ],
+    "description": "Angular form submit"
+  },
   "ngIf": {
     "prefix": "a-ngIf",
     "body": ["*ngIf=\"${1:expression}\""],

test/test.html

@@ -1,5 +1,6 @@
 <html>
   <body>
     <div></div>
+    
   </body>
 </html>