Changing View Visibility

From the very beginning it should be said that Webix views can't be hidden and shown back with Angular ngShow and ngHide directives that can still be used to manipulate visibility of pure HTML elements.

As you know, Webix views are created with the help of the webix.ui() constructor that is called by webix-ui directive.

<body ng-app="Webix App">
    <div style="width:800px;"></div> <!--standard HTML element-->
    <div webix-ui type="wide">
        <!-- all divs inside this and including this are parsed as Webix views-->
    </div>
</body>

To show and hide Webix Views a special webix-show directive should be used. Remember that all divs without the view attribute are parsed as Webix templates. Views are initially hidden.

<div webix-ui type="wide">
    <div width="200" webix-show="showLeft">Left</div>
</div>

The webix-show directive declares a variable which value (a boolean) can be changed on some event afterwards. Here button click is used:

<!-- showing view -->
<button ng-click="showLeft=true">Show Left</button>
 
<!-- hiding view -->
<button ng-click="showLeft=false">Hide Left</button>

Related sample: Webix-Angular:Visibility