Question

我有一个带有JSON类型的用户实体的动态模型。我需要显示一个表单以使用dropdownlist选择值foreach属性，然后插入到数据库中。就像用户的实体具有属性的性别和年龄（属性可以由客户的首页进行编辑）。示例结果如下：

[
      {
        "bindValue": null,
        "title": "sex",
        "code":"sex",
        "property": {
          "option": [
            "male",
            "female"
          ]
        }
      },
      {
        "bindValue": null,
        "code":"grade",
        "property": {
          "option": [
            "2",
            "3"
          ]
        }
      }
    ]

我可以用角度离子项目进行编码：

    <ng-container *ngFor="let x of dynamicdroplist">
      <ion-item>
        <ion-label fixed>{{x.title}}</ion-label>
        <ion-select [(ngModel)]="x.bindValue">
          <ion-select-option *ngFor="let y of x.property.option" value="{{y}}">{{y}}</ion-select-option>
        </ion-select>
      </ion-item>
    </ng-container>

当用户更改选择值时，它将“ ngModel”绑定到x.bindvalue，我可以过滤代码和将binvalue数据发送到api。

但是使用xamarin表单，我不知道如何将选择值绑定到bindvalue

foreach(var item in field){
     StackLayout layout = new StackLayout().LoadFromXaml("<StackLayout></StackLayout>");
     layout.Children.Add(new Label().LoadFromXaml("<Label Text=\"" + item.Title + "\"></Label>"));
     var picker = new Picker { Title = item.Title };
     foreach (var e in item.Property.option)
     {
          picker.Items.Add(e);
     }          
     layout.Children.Add(picker);
      _stackLayout.Children.Add(layout);
}

我想知道如何使用xamarin表单进行编码吗？

Answer 1

如果您以编程方式需要该值，则只需使用声明的选择器变量即可访问它；

picker.SelectedItem

否则，如果要将其绑定到UI，可以;

myLabel.SetBinding(Label.TextProperty, new Binding("SelectedItem", source: picker));

Answer 2

您可以将Picker.SelectedItem绑定到bindValue中的TwoWay，然后如果用户更改选择值，则模型中的bindValue将更新：

 picker.BindingContext = item;
 picker.SetBinding(Picker.SelectedItemProperty, "bindValue",mode:BindingMode.TwoWay);

这是您可以参考的示例代码：

public partial class MainPage : ContentPage
{

    StackLayout _stackLayout;

    List<RootObject> field = new List<RootObject>();
    public MainPage()
    {
        InitializeComponent();

        _stackLayout = new StackLayout();


        field.Add(new RootObject() { bindValue = "", title = "sex", code ="sex", property = new Property() { option = new List<string>() { "male","female"} } });
        field.Add(new RootObject() { bindValue = "", title = "grade", code = "grade", property = new Property() { option = new List<string>() { "2", "3" } } });

        foreach (RootObject item in field)
        {
            StackLayout layout = new StackLayout();
            layout.Children.Add(new Label() { Text = item.title });
            var picker = new Picker { Title = item.title };

            //set the BindingContext here
            picker.BindingContext = item;

            foreach (string e in item.property.option)
            {
                picker.Items.Add(e);

                //bind the value here
                picker.SetBinding(Picker.SelectedItemProperty, "bindValue",mode:BindingMode.TwoWay);
            }
            layout.Children.Add(picker);

            picker.SelectedIndexChanged += Picker_SelectedIndexChanged;

            _stackLayout.Children.Add(layout);
        }

        Content = _stackLayout;
    }

    private void Picker_SelectedIndexChanged(object sender, EventArgs e)
    {
        //check the value change in field
        RootObject r1 = field[0];
        Console.WriteLine(r1.bindValue);

        RootObject r2 = field[1];
        Console.WriteLine(r2.bindValue);
    }
}


public class Property
{
    public List<string> option { get; set; }
}

public class RootObject
{
    public string bindValue { get; set; }
    public string title { get; set; }
    public string code { get; set; }
    public Property property { get; set; }
}

引用：data-binding

xamarin形式选择器将选定的值绑定到NgModel像角

2 个答案: