XAML ContentControl數據綁定不起作用

Question

我有一個DataTemplates和ContentControl的問題。 我的情況非常具體。

XAML頁面：

<Page
    x:Class="Questionnaires.QuestionPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Questionnaires"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:selectors="using:Questionnaires.TemplateSelectors"
    xmlns:interop="using:Windows.UI.Xaml.Interop"
    mc:Ignorable="d">

    <Page.Resources>
        <!-- TODO: Delete this line if the key AppName is declared in App.xaml -->
        <selectors:QuestionTypeItemTemplateSelector x:Key="QuestionTypeSelector" />
        <selectors:AnswerTypeItemTemplateSelector x:Key="AnswerTypeSelector"/>

        <DataTemplate x:Key="SingleSelectQuestionItemTemplate">
            <Grid Margin="10">
                <RadioButton HorizontalAlignment="Left" VerticalAlignment="Center" 
                             IsChecked="{Binding IsChecked, Mode=TwoWay}"
                             Width="600" Height="Auto" GroupName="groupName">
                    <RadioButton.Content>
                        <TextBlock Text="{Binding Text}" TextWrapping="Wrap"/>
                    </RadioButton.Content>
                </RadioButton>
            </Grid>
        </DataTemplate>
        <DataTemplate x:Key="FreeQuestionItemTemplate">
            <Grid Margin="10">

                <ContentPresenter Content="{Binding}" ContentTemplateSelector="{StaticResource AnswerTypeSelector}" />


                <!--
                <GridView ItemsSource="{Binding}" SelectionMode="None">

                    <GridView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapGrid Orientation="Horizontal" />
                        </ItemsPanelTemplate>
                    </GridView.ItemsPanel>
                </GridView>
                -->
            </Grid>
        </DataTemplate>
        <DataTemplate x:Key="MultiSelectQuestionItemTemplate">
            <Grid Margin="10">
                <CheckBox HorizontalAlignment="Left" VerticalAlignment="Center"
                          IsChecked="{Binding IsChecked, Mode=TwoWay}" Width="600">
                    <CheckBox.Content>
                        <TextBlock Text="{Binding Text}" TextWrapping="Wrap"/>
                    </CheckBox.Content>    
                </CheckBox>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="LabelAnswerItemTemplate">
        </DataTemplate>

        <DataTemplate x:Key="TextAreaAnswerItemTemplate">
        </DataTemplate>

        <DataTemplate x:Key="TextFieldAnswerItemTemplate">
        </DataTemplate>

        <DataTemplate x:Key="DateAnswerItemTemplate">
        </DataTemplate>

        <DataTemplate x:Key="SliderAnswerItemTemplate">
            <Grid Margin="10">
                <Slider Width="600" Minimum="0" Maximum="100" Value="25" />
            </Grid>
        </DataTemplate>

    </Page.Resources>

    <Grid>
        <Grid.Background>
            <ImageBrush Stretch="None" ImageSource="Assets/IS_Bol_White.png"/>
        </Grid.Background>
        <Grid.ChildrenTransitions>
            <TransitionCollection>
                <EntranceThemeTransition/>
            </TransitionCollection>
        </Grid.ChildrenTransitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="100"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="108*"/>
            <RowDefinition Height="60"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="120"/>
            <ColumnDefinition Width="235*"/>
            <ColumnDefinition Width="1011*"/>
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="pageTitle" Text="{Binding Path=Assignment.Definition.Name}" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                        IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,0,30,40" Grid.ColumnSpan="2" FontSize="48"/>

        <Image Grid.Column="2" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,30,0" Width="252" Height="71" Source="ms-appx:///Assets\innovationstudio.png" />

        <Grid Grid.Column="2" Grid.Row="1" Margin="3,0,358,0" Width="650">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <ProgressBar Grid.Row ="0" Maximum="1" Value="{Binding Progress}" IsIndeterminate="False" Grid.ColumnSpan="2" Foreground="Black"/>
            <TextBlock Grid.Row="1" Grid.ColumnSpan="2" Margin="10 20" TextAlignment="Left" HorizontalAlignment="Left" Style="{StaticResource SubheaderTextBlockStyle}"
                       Text="{Binding CurrentQuestion.Text}" />

        </Grid>

        <GridView Grid.Column="2" Grid.Row="2" ItemsSource="{Binding CurrentQuestion.PossibleAnswers}" 
                  ItemTemplateSelector="{StaticResource QuestionTypeSelector}" SelectionMode="None">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
        </GridView>

        <Grid Grid.Column="2" Grid.Row="3" Margin="3,0,358,0" Width="650">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Button x:Name="btn_Previous" Grid.Column="0" HorizontalAlignment="Left" Content="Vorige" Height="59" Width="175" IsEnabled="{Binding IsPreviousButtonEnabled}" Click="btnPrevious_Click"/>
            <Button x:Name="btn_Next" Grid.Column="1" HorizontalAlignment="Right" Content="Volgende" Height="59" Width="175" IsEnabled="{Binding IsNextButtonEnabled}" Click="btnNext_Click"/>
        </Grid>
    </Grid>
</Page>

我使用ItemTemplateSelector來指定它將成為哪種類型的問題。 QuestionType在PossibleAnswer對象中定義。 我的ItemTemplateSelector看起來像這樣：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Questionnaires.Models;
using Questionnaires.ViewModels;

namespace Questionnaires.TemplateSelectors
{
    public class QuestionTypeItemTemplateSelector : DataTemplateSelector
    {
        protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
        {
            switch (((PossibleAnswer)(item)).QuestionType)
            {
                case "FREE":
                    return
                        ((Page) ((Frame) Window.Current.Content).Content).Resources["FreeQuestionItemTemplate"] 
                            as
                            Windows.UI.Xaml.DataTemplate;
                case "SINGLE_SELECT":
                    return
                        ((Page) ((Frame) Window.Current.Content).Content).Resources["SingleSelectQuestionItemTemplate"]
                            as
                            Windows.UI.Xaml.DataTemplate;
                case "MULTI_SELECT":
                    return
                        ((Page) ((Frame) Window.Current.Content).Content).Resources["MultiSelectQuestionItemTemplate"]
                            as Windows.UI.Xaml.DataTemplate;
                case "DROPDOWN":
                    return
                        ((Page) ((Frame) Window.Current.Content).Content).Resources["DropdownQuestionItemTemplate"]
                            as Windows.UI.Xaml.DataTemplate;
                default:
                    return null;
            }
        }
    }
}

這樣我就可以指定需要在我的頁面上顯示哪個datatemplate。 我目前正在處理免費問題，所以我現在正在談論一個模板。 我的xaml上的模板如下所示：

<Page.Resources>
    <!-- TODO: Delete this line if the key AppName is declared in App.xaml -->
    <selectors:QuestionTypeItemTemplateSelector x:Key="QuestionTypeSelector" />
    <selectors:AnswerTypeItemTemplateSelector x:Key="AnswerTypeSelector"/>

    <DataTemplate x:Key="FreeQuestionItemTemplate">
        <Grid Margin="10">
            <ContentControl Content="{Binding}" ContentTemplateSelector="{StaticResource AnswerTypeSelector}" />
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="SliderAnswerItemTemplate">
        <Grid Margin="10">
            <Slider Width="600" Minimum="0" Maximum="100" Value="25" />
        </Grid>
    </DataTemplate>
</Page.Resources>

為了使事情更清楚：QuestionType和PossibleAnswerType之間存在差異。 QuestionType可以是：

免費的SINGLE_SELECT MULTI_SELECT DROPDOWN TABLE

PossibleAnswerType可以是：

LABEL TEXT_AREA TEXT_FIELD日期幻燈片

我嘗試在FreeQuestionTemplate中獲取PossibleAnswer的PossibleAnswerType。 我正在使用ContentControl來執行此操作，但我的PossibleAnswer的綁定似乎不起作用。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Questionnaires.Models;

namespace Questionnaires.TemplateSelectors
{
    public class AnswerTypeItemTemplateSelector : DataTemplateSelector
    {
        protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
        {
            switch (((PossibleAnswer) (item)).PossibleAnswerType)
            {
                case "LABEL":
                    return
                       ((Page)((Frame)Window.Current.Content).Content).Resources["LabelAnswerItemTemplate"]
                           as
                           Windows.UI.Xaml.DataTemplate;
                case "TEXT_AREA":
                    return
                       ((Page)((Frame)Window.Current.Content).Content).Resources["TextAreaAnswerItemTemplate"]
                           as
                           Windows.UI.Xaml.DataTemplate;
                case "TEXT_FIELD":
                    return
                       ((Page)((Frame)Window.Current.Content).Content).Resources["TextFieldAnswerItemTemplate"]
                           as
                           Windows.UI.Xaml.DataTemplate;
                case "DATE":
                    return
                       ((Page)((Frame)Window.Current.Content).Content).Resources["DateAnswerItemTemplate"]
                           as
                           Windows.UI.Xaml.DataTemplate;
                case "SLIDER":
                    return
                       ((Page)((Frame)Window.Current.Content).Content).Resources["SliderAnswerItemTemplate"]
                           as
                           Windows.UI.Xaml.DataTemplate;
                default:
                    return null;
            }
        }
    }
}

在我的AnswerTypeItemTemplateSelector中，item對象始終為null。 有誰給我一些關於如何做到這一點的建議？

親切的問候！

Answer 1

好的，看看你的新代碼，我認為我已經解決了你的問題。 您的AnswerTypeItemTemplateSelector用於FreeQuestionItemTemplate DataTemplate ，它在QuestionTypeItemTemplateSelector 。 除非你遺漏了一些XAML，否則好像你沒有在任何地方使用QuestionTypeItemTemplateSelector ，所以這些都沒有“插入”。

---

更新>>>

為了使任何Binding工作，您必須將Page的DataContext設置為一些有意義的值。 DataContext告訴UI中的元素在哪里查找其數據綁定值。 在沒有設置DataContext ，UI元素將無法訪問任何數據（除非已經在XAML中聲明了一些數據，但是不要混淆這一點）。 有關更多信息，請查看有關CodeProject的WPF文章中的DataContext 。