feat(select): Add a sample of select in a form.

templates/angular/igx-ts/select/select-groups/files/src/app/__path__/__name__.component.scss

@@ -1,3 +1,3 @@
 .select-wrapper {
-	padding-top: 50ox
+	padding-top: 50px
 }

templates/angular/igx-ts/select/select-in-form/files/src/app/__path__/__name__.component.html

@@ -0,0 +1,13 @@
+<form>
+	<div class="select-wrapper">
+		<igx-select [(ngModel)]="selected" [ngModelOptions]="{standalone: true}">
+			<igx-select-item *ngFor="let item of items" [value]="item">
+				{{item}}
+			</igx-select-item>
+		</igx-select>
+		<div class="actions">
+			<button igxButton (click)="onSubmit()">Submit</button>
+		</div>
+	</div>
+	<p class="output">You selected: {{value}}</p>
+</form>

templates/angular/igx-ts/select/select-in-form/files/src/app/__path__/__name__.component.scss

@@ -0,0 +1,11 @@
+.select-wrapper {
+	padding-top: 50px;
+	display: flex;
+	flex-flow: row;
+}
+
+.actions {
+	display: flex;
+	flex-flow: column;
+	padding-left: 20px;
+}

templates/angular/igx-ts/select/select-in-form/files/src/app/__path__/__name__.component.spec.ts

@@ -0,0 +1,34 @@
+import { FormsModule } from '@angular/forms';
+import { async, TestBed, ComponentFixture } from "@angular/core/testing";
+import { NoopAnimationsModule } from "@angular/platform-browser/animations";
+
+import { $(ClassName)Component } from "./$(filePrefix).component";
+import { IgxSelectModule, IgxToggleModule } from "igniteui-angular";
+
+describe("$(ClassName)Component", () => {
+    let component: $(ClassName)Component;
+    let fixture: ComponentFixture<$(ClassName)Component >;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [$(ClassName)Component],
+            imports: [
+                FormsModule,
+                IgxSelectModule,
+                IgxToggleModule,
+                NoopAnimationsModule,
+            ]
+        })
+            .compileComponents();
+    }));
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent($(ClassName)Component);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it("should create", () => {
+        expect(component).toBeTruthy();
+    });
+});

templates/angular/igx-ts/select/select-in-form/files/src/app/__path__/__name__.component.ts

@@ -0,0 +1,19 @@
+import { Component, ViewChild } from "@angular/core";
+import { IgxSelectComponent } from "igniteui-angular";
+
+@Component({
+    selector: "app-$(filePrefix)",
+    styleUrls: ["$(filePrefix).component.scss"],
+    templateUrl: "$(filePrefix).component.html"
+})
+export class $(ClassName)Component {
+    @ViewChild(IgxSelectComponent)
+    public igxSelect: IgxSelectComponent;
+
+    public items: string[] = ["Orange", "Apple", "Banana", "Mango"];
+    public value: string;
+
+	public onSubmit() {
+		this.value = this.igxSelect.value;
+	}
+}

templates/angular/igx-ts/select/select-in-form/index.ts

@@ -0,0 +1,22 @@
+import { IgniteUIForAngularTemplate } from "../../../../../lib/templates/IgniteUIForAngularTemplate";
+
+class IgxSelectTemplate extends IgniteUIForAngularTemplate {
+	constructor() {
+		super(__dirname);
+		this.components = ["Select In Form"];
+		this.controlGroup = "Grids & Lists";
+		this.listInComponentTemplates = true;
+		this.id = "select-in-form";
+		this.projectType = "igx-ts";
+		this.name = "Select In Form";
+		this.description = "IgxSelect in a form";
+		this.dependencies = [{
+			import: [
+				"IgxSelectModule", "IgxDropDownModule", "IgxFilterModule",
+				"IgxButtonModule", "IgxToggleModule"
+			],
+			from: "igniteui-angular"
+		}];
+	}
+}
+module.exports = new IgxSelectTemplate();