Detach a Component under MVVM

Under MVVM Pattern

we have 2 approaches: 1. Change "src" of <include> Include your modal component with data binding, e.g.

<include src="@load(vm.myModal)">

By changing the attribute vm.myModal to empty string (""), the included components will be detached.

If you want to pass some arguments to include component for judgment, please refer to http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/MVVM/Advanced/Pass_Arguments_to_Include_Component

2. Make a component invisible. If your requirement doesn't strictly have to detach a modal, and make it invisible is also acceptable. You can just bind an attribute to modal's "visible" property to control its visibility. It's relatively simpler approach.

Break MVVM Pattern

If you decide not to use pure MVVM pattern, and access components in a ViewModel.

There are 2 ways to access a component in a ViewModel:

The one is to pass a component as a parameter in a command binding. http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/MVVM/Advanced/Parameters

The Another one is to wire a component in a ViewModel's member field like SelectorComposer. http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/MVVM/Advanced/Wire_Components

After getting the component, you can do what the component can do by calling its method e.g. detach().