在智能表中设置UI-Select默认值

在智能表中设置UI-Select默认值

我有一个基于Angular的web项目，我遇到了一个问题。我正在将数据加载到智能表中。在智能表定义中，我有一个定义为ui-select(下拉)的列。我的问题是，当我加载行数据。我无法让ui-select默认为从数据库返回的值。例如，我的智能表定义如下:

1、1、2、3、4

R1C1 R1C2 R1C3 R1C4 -取值1

R2C1 R2C2 R2C3 R1C4 -取值4

R3C1 R3C2 R3C3 R1C4 -取值2

R4C1 R4C2 R4C3 R1C4 -取值1

我的数据检索从Couchbase数据库返回如下:

[
 {
  Datavalue1: C1,
  Datavalue2: C2,
  Datavalue1: C3,
  Datavalue2: C4-id
 },
 {
  Datavalue1: C1,
  Datavalue2: C2
  Datavalue1: C3,
  Datavalue2: C4-id
 },
 {
  Datavalue1: C1,
  Datavalue2: C2
  Datavalue1: C3,
  Datavalue2: C4-id
 },
 {
  Datavalue1: C1,
  Datavalue2: C2
  Datavalue1: C3,
  Datavalue2: C4-id
 }
]

我加载表如下

<tr ng-repeat='row in dG' st-select-row="row" style="white-space: nowrap" st-select-mode="multiple">
    <td>{{ C1}}</td>
     <td>{{ C2 }}</td> 
     <td> {{ C3}} </td>
     <td>
     <ui-select ng-model="row.data.filters.C4" theme="bootstrap" name="C4Col" style="width:400px">
             <ui-select-match placeholder="Select C4"> {{ $select.selected.c4Name }}
             </ui-select-match>
              <ui-select-choices repeat="C4Array in C4Array | filter: $select.search" 
               style="position: relative;top: auto;left: auto; width: inherit">
               <span ng-bind-html="C4Array.C4Name| highlight: $select.search"></span>
              </ui-select-choices>
            </ui-select>
           </td>

在我尝试加载C4下拉菜单时，我执行了以下操作:

已使用ui-option ng-selected = " C4 "
using ui-option ng-selected = " row.data.filters. "
使用ui-option ng-selected = " $select.selected. "c4Name = c4Name "
ui-select ng-model="row.data.filters. "主题="bootstrap" name="C4Col" style="width:400px" ng-selected ="C4 "
重建dG数组，包括C4-id和C4Name数据
使用重建dG阵列作为尝试1,2,3的数据在ui-select ng-selected中
类似于尝试1,2,3

上面的列表并不是所有尝试过的选项。我尝试了这么多不同的选择，如果我知道我会遇到这么多困难，我就会保存它们。

我知道ui-select的ng-model必须在下拉菜单显示该值之前加载默认值。我的问题围绕如何为智能表中的每一行设置ng模型展开。

如果您能帮助我解决这个问题，我将不胜感激。

我通过将ng-model表达式替换为存储在客户端控制器中的位置来解决此问题。我将客户端控制器中的位置预设为数据库返回值(下拉结构)，并将适当的值显示为下拉框的默认值。

附加信息2016年7月10日

在发现我的初始解决方案在添加智能表排序功能后失败后，我寻找另一个解决方案。在对数据、数据放置和数据结构进行了几次重新设计之后，我相信我找到了一个可行的解决方案。解决办法看起来如此简单，我简直不敢相信它会奏效。我没有为数据数组外的下拉菜单的ui-select跟踪ng模型，而是将其添加到实际返回的数据中。由于我正在执行来自couchbase的数据的RestAPI检索，因此我需要将数据放入智能表的对象数组中。我只是向数组中添加了额外的字段，将各个字段设置为默认值。然后我将ng模型更改为数组中的新字段。之后，我能够对数据进行排序，默认值保持与适当的行相关联。

相关内容

最新更新

热门标签：