fix(ui-category): simplify disable-switch example (#131)

Author: sis0k0

app/ui-category/switch/disable-switch/article.md

@@ -1,5 +1,3 @@
-Set `Switch` in `HTML` code
-<snippet id='switch-view-html'/>
-
-Disable `Switch` control via setting `isEnable` property to false
-<snippet id='disable-switch-code'/>
+Set `Switch` in `HTML` code.
+Disable `Switch` control via setting `isEnabled` property to false.
+<snippet id='disable-switch'/>

app/ui-category/switch/disable-switch/disable-switch.component.html

@@ -1,15 +1,17 @@
 <StackLayout sdkExampleTitle sdkToggleNavButton>
     <StackLayout class="example-container">
-        <!-- >> switch-view-html -->
-        <GridLayout rows="auto auto auto auto" columns="* *" class="m-5">
-            <Label class="h3 m-15" [text]="sw1.isEnabled ? 'enabled' : 'disabled'" textWrap="true" row="0" col="0"></Label>
-            <Switch class="m-15" #sw1 checked="true" row="0" col="1"></Switch>
-            <Label class="h3 m-15" [text]="sw2.isEnabled ? 'enabled' : 'disabled'" textWrap="true" row="1" col="0"></Label>
-            <Switch class="m-15" #sw2 checked="false" row="1" col="1"></Switch>
-            <Label class="h3 m-15" [text]="sw3.isEnabled ? 'enabled' : 'disabled'" textWrap="true" row="2" col="0"></Label>
-            <Switch class="m-15" #sw3 checked="true" row="2" col="1"></Switch>
-            <Button class="btn btn-primary btn-active" text="Disable switches" (tap)="onTap()" row="3" col="0" colSpan="2" horizontalAlignment="stretch"></Button>
+        <!-- >> disable-switch -->
+        <GridLayout rows="auto auto" columns="* *" class="m-5">
+            <Label class="h3 m-15"
+                [text]="switch.isEnabled ? 'enabled' : 'disabled'"
+                textWrap="true" row="0" col="0"></Label>
+            <Switch #switch class="m-15" row="0" col="1"></Switch>
+
+            <Button class="btn btn-primary btn-active"
+                [text]="switch.isEnabled ? 'Disable switch' : 'Enable switch'"
+                (tap)="switch.isEnabled = !switch.isEnabled"
+                row="3" col="0" colSpan="2" horizontalAlignment="stretch"></Button>
         </GridLayout>
-        <!-- << switch-view-html -->
+        <!-- << disable-switch -->
     </StackLayout>
 </StackLayout>

app/ui-category/switch/disable-switch/disable-switch.component.ts

@@ -1,4 +1,3 @@
-// >> disable-switch-code
 import { Component, ViewChild, ElementRef } from "@angular/core";
 import { Switch } from "ui/switch";
 
@@ -8,20 +7,4 @@ import { Switch } from "ui/switch";
     styleUrls: ["./../switch.style.css"],
 })
 export class DisableSwitchComponent {
-
-    @ViewChild("sw1") firstSwitch: ElementRef;
-    @ViewChild("sw2") secondSwitch: ElementRef;
-    @ViewChild("sw3") thirdSwitch: ElementRef;
-
-    public onTap() {
-        let firstsw: Switch = <Switch>this.firstSwitch.nativeElement;
-        let secondsw: Switch = <Switch>this.secondSwitch.nativeElement;
-        let thirdsw: Switch = <Switch>this.thirdSwitch.nativeElement;
-
-        firstsw.isEnabled = false;
-        secondsw.isEnabled = false;
-        thirdsw.isEnabled = false;
-    }
-
 }
-// << disable-switch-code