如何绑定到viewmodel而不是页面

时间:2018-04-05 14:17:10

标签: c# xaml xamarin xamarin.forms

我的问题在于viewcell,由于它是IssueModel类而找不到OnDelete命令,我试图改变Listview的绑定上下文,但这并没有改变任何东西除了上述绑定。

有没有办法改变视单元的绑定上下文,所以我不必将命令放入IssueModel?我尝试过以下解决方案,但收到错误

"标记扩展名无效:期望的类型是对象,实际类型是Issuepagemodel"

      xmlns:pageModels="clr-namespace:ASFT.PageModels;assembly=ASFT"

 <ListView ItemsSource="{Binding Issues}" SeparatorColor="#444444" RowHeight="90" IsPullToRefreshEnabled="True" IsRefreshing="{Binding IsBusy}" RefreshCommand="{Binding PullRefreshCommand}" >
        <ListView.Behaviors>
        <helperMethods:EventToCommandBehavior EventName="ItemSelected" 
                                          Command="{Binding OnSelectedIssueCommand}" 
                                          Converter="{StaticResource SelectedItemConverter}" />
        </ListView.Behaviors>
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell x:Name="Stalin">
                    <ViewCell.ContextActions>
                        <MenuItem x:Name="Hitler" Command="{Binding Path=BindingContext.OnDelete, Source={pageModels:IssueListPageModel}}" Text="Delete" IsDestructive="True" />
                    </ViewCell.ContextActions>

                    <ViewCell.View>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="*"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="70"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                                <ColumnDefinition Width="50"></ColumnDefinition>
                            </Grid.ColumnDefinitions>

                            <Image Grid.Row="0" Grid.RowSpan="3" Grid.Column="0" Source="{Binding SeverityImagePath}" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="70"/>
                            <Image Grid.Row="0" Grid.RowSpan="3" Grid.Column="2" Source="{Binding StatusImagePath}" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="60"/>

                            <Label Grid.Row="0" Grid.Column="1" Text="{Binding Title}" LineBreakMode="TailTruncation" YAlign="Center" VerticalOptions="Start" Font="Bold, Medium"/>
                            <Label Grid.Row="1" Grid.Column="1" Text="{Binding Created, Converter={StaticResource DateToTextConverter}}" YAlign="Center" VerticalOptions="Start" Font="Medium"/>
                            <Label Grid.Row="2" Grid.Column="1" Text="{Binding Description}" LineBreakMode="WordWrap" YAlign="Start" VerticalOptions="Start" Font="Small"/>
                        </Grid>

                    </ViewCell.View>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

1 个答案:

答案 0 :(得分:3)

如果我理解你的问题,应该很容易。

将您的网页BindingContext设置为ViewModel,其中包含Command,其中包含下一个名称&#34; MyRootLevelCommand&#34;。

命名您的根UI元素:

<Grid x:Name="root"> .. </Grid>

我们假设在Grid ListView中您有一个Command,并且您希望将 <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Button Command="{Binding Source={x:Reference root}, Path=BindingContext.MyRootLevelCommand}" /> </ViewCell> </DataTemplate> </ListView.ItemTemplate> 从页面视图模型绑定到ListView中的每个项目:

//example 1
$("#water1").click(function(){$("#garden1").append('<div>water</div>');});
$("#seed1").click(function(){$("#garden1").append('<span><div>seed</div></span>');});
$("#sun1").click(function(){$("#garden1>div").addClass('vapor');});
$("#moon1").click(function(){$("#garden1 div").removeClass('vapor');});

//example2
$("#water2").click(function(){$("#garden2").append('<option class="water2">water</option>');});
$("#seed2").click(function(){$("#garden2").append('<option>seed</option>');});
$("#sun2").click(function(){$("#garden2>option.water2").wrap('<span>');});
$("#moon2").click(function(){$("#garden2 span option.water2").unwrap();});