c# - WPF binding different UserControls in a DataTemplate of TabControl -

as new in wpf , mvvm light, struggling apply mvvm pattern in tabcontrol. give example of trying achieve.

tabone xaml , view model

<usercontrol x:class="testtabcontrol.tabone"              xmlns:local="clr-namespace:testtabcontrol"              mc:ignorable="d"               d:designheight="300" d:designwidth="300">     <grid>         <textblock text="tab 1 ..." fontweight="bold" fontsize="14" horizontalalignment="center" verticalalignment="center" />     </grid> </usercontrol>  //tabone viewmodel class tabone : viewmodelbase {     public string tabname     {                 {             return "tabone";         }     } } 

tabtwo xaml , viewmodel

<usercontrol x:class="testtabcontrol.tabtwo"              xmlns:local="clr-namespace:testtabcontrol"              mc:ignorable="d"               d:designheight="300" d:designwidth="300">     <grid>         <textblock text="tab 2 ..." fontweight="bold" fontsize="14" horizontalalignment="center" verticalalignment="center" />     </grid> </usercontrol>  //tabtwo viewmodel class tabtwo : viewmodelbase {     public string tabname     {                 {             return "tabtwo";         }     } } 

and mainwindow xaml , viewmodel

<window x:class="testtabcontrol.mainwindow"         xmlns:local="clr-namespace:testtabcontrol"         mc:ignorable="d"         title="test tab control" minwidth="500" width="1000" height="800">     <tabcontrol itemssource="{binding tabviewmodels}" >         <tabcontrol.itemtemplate >             <!-- header template -->             <datatemplate>                 <textblock text="{binding tabname}" />             </datatemplate>         </tabcontrol.itemtemplate>         <tabcontrol.contenttemplate>             <datatemplate>                 ?????????             </datatemplate>         </tabcontrol.contenttemplate>     </tabcontrol> </window>   //mainwindow viewmodel  class mainwindowviewmodel : viewmodelbase {     private observablecollection<viewmodelbase> _tabviewmodels;      public mainwindowviewmodel()     {         _tabviewmodels = new observablecollection<viewmodelbase>();         tabviewmodels.add(new tabone());         tabviewmodels.add(new tabtwo());     }      public observablecollection<viewmodelbase> tabviewmodels     {                 {             return _tabviewmodels;         }         set  // part right?         {             _tabviewmodels = value;             raisepropertychanged(() => tabviewmodels);         }     } } 

what supposed write in datatemplate? can pass both usercontrols tabone , tabtwo in datatemplate in order view each tab click? or need write datatemplate?