0

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

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

第 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 下拉列表时，我执行了以下操作：

  1. 使用 ui-option ng-selected = “C4”
  2. 使用 ui-option ng-selected = “row.data.filters.C4 = C4”
  3. 使用 ui-option ng-selected = “$select.selected.c4Name = C4Name”
  4. ui-select ng-model="row.data.filters.C4" theme="bootstrap" name="C4Col" style="width:400px" ng-selected = “C4”
  5. 将 dG 数组重建为包含 C4-id 和 C4Name 数据
  6. 使用重建 dG 数组作为尝试 1、2、3 的数据
  7. 在 ui-select ng-selected 中类似于尝试 1、2、3

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

我知道 ui-select 的 ng-model 必须先加载默认值，然后下拉菜单才会显示该值。我的问题围绕着如何为智能表中的每一行设置 ng-model。

对于解决此问题的任何帮助，我将不胜感激。

4

1 回答 1

0

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

2016 年 10 月 7 日添加的附加信息

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

于 2016-10-05T13:32:51.887 回答