AngularJS: ui-select将数据绑定回select

Question

我使用的是Angular js 1.3.4版本，并使用ui-select。

我将复杂的多级JSON对象数组绑定到这个ui-select，它工作得很好。因此，用户可以选择此select中的任何选项。当用户保存其他数据和此选择数据时，我将此信息保存在数据库中。所有这些都运行得很好。

我遇到的问题是如何将数据绑定到它。这可能不是ui-select的问题，因为我也不能将数据绑定回textbox。

下面是我从我的数据库中得到的json(经过一些修改)：

{
   "input1":{
      "set1":{
         "source":"uat1",
         "value":"value1"
      },
      "set2":{
         "source":"uat",
         "value":"value2",
         "options":[
            {
               "name":"option1"
            },
            {
               "name":"option2"
            }
         ]
      }
   },
   "input2":{
      "set3":{
         "source":"uat1",
         "value":"value3"
      },
      "set4":{
         "source":"uat",
         "value":"value4",
         "options":[
            {
               "name":"option3"
            },
            {
               "name":"option4"
            }
         ]
      }
   }
}

下面是我尝试绑定回数据的指令：

 <div class="form-group" ng-repeat="(name, set) in sets">
    <label>{{name}}</label>
    <ui-select name="{{inputName + $index}}" ng-model="set.value" theme="bootstrap" ng-if="set.source == 'uat'">
        <ui-select-match placeholder="Set">{{set.value.name}}</ui-select-match>
        <ui-select-choices repeat="ds in set.options | filter: $select.search track by $index">
            <div ng-bind-html="ds.name | highlight: $select.search"></div>       
        </ui-select-choices>
    </ui-select>
    <input type="text" ng-if="set.source == 'uat1'" name="{{inputName + $index}}" ng-model="set.value" />
</div>

上面的结果是，对于我的ui-select，我可以看到选项，这意味着它与我传入的json数据正确绑定。问题是显示的值。我在ui-select中看不到任何选择，我的文本框也是空的。

由于上面每一个的模型都是ng-model = 'set.value‘，所以我在我的json中传递了这个参数。因此，我认为这会起作用，但它不是。

我相信我的Json遗漏了一些东西。谁能指出这里遗漏了什么，这样我就可以看到我的json中对应控件的value字段。

谢谢。

Answer 1

在AngularJS ui-select中，ui-select-match指令用于显示选定的值以及应显示在文本框中的值。您在此处显示了错误的数据(set.value.name)。相反，您需要使用$select.selected.name显示所选值。

<ui-select-match placeholder="Set">{{$select.selected.name}}</ui-select-match>

您的ui-select-choices是对象，因此如果要从控制器设置默认值，您的值需要是存在于选项中的对象。因此，您可以通过将正确的值分配给您的ng-model set.value来设置ui-select的默认值。

"value": {
    "name":"option1"
}