1

我正在尝试构建一个与本网站完全相同的标签输入字段。用户可以开始输入标签,ui-typeahead 返回一个列表,用户从中选择一个结果,将其添加到输入字段中已有的标签列表中。

我首先将问题简化为字符串连接,而不是列表。我什至无法让它工作。这是我必须要做的,但它不会与字段的现有值连接,它会替换它:

<input class="form-control" type="text" ng-model="program.Demographs"
    typeahead="d for d in program.providers.Demographs"
    typeahead-min-length='3' typeahead-items='10'
    typeahead-editable="false"
    typeahead-on-select="addItem(program.Demographs)">

这是应该连接字符串的函数:

$scope.addItem = function (item) {
    $scope.program.Demographs = $scope.program.Demographs + item;
};

任何人都可以提供任何提示或建议吗?

4

2 回答 2

1

试试这个而不是连接;

 $scope.program.Demographs = [];

    $scope.addItem = function (item) {
        $scope.program.Demographs = $scope.program.Demographs.push(item);
    };
于 2013-09-02T07:23:23.613 回答
1

在确定无法将项目添加到预输入输入字段中的现有选择后,我想我会自己回答这个问题。相反,您必须添加到不同的字符串或数组,而不是绑定到预先输入的那个。这是一个例子:

$scope.addDemograph = function (item) {
    if ($scope.program.Demographs.indexOf(item) == -1) {
        $scope.program.Demographs.push(item);
    }
    $scope.demographs_input = [];
};

<input class="form-control" type="text" placeholder="Demographs"
   ng-model="demographs_input"
   typeahead="d for d in program.providers.Demographs"
   typeahead-on-select="addDemograph(demographs_input)"> // adds input val to list

<ul class="list-inline">
<li ng-repeat="d in program.Demographs"></li> <!--this list is added to automagically-->
</ul>
于 2013-09-03T23:36:22.217 回答