Angucomplete-alt 在自动完成标签上使用 ng-scope

Question

我有一个带有输入标签的表单，我想在其中使用自动完成功能，允许用户输入名称，并在用户输入名称字符时显示自动完成建议。

我的问题是，如果用户不想使用自动完成名称并希望使用自定义名称，我该如何在我的控制器中访问它。

我无法在此输入标签上设置 ng-model，因为它由 angucomlete-alt 内部管理。

我在 ng-repeat 中有这个 autocomlete-alt 标签。

<div ng-repeat="resident in vm.residents">

    <div class="form-group">
    <label class="col-lg-2 col-sm-2 control-label">Name</label>
        <div class="col-lg-6">
            <angucomplete-alt 
                placeholder="Name"
                pause="100"
                selected-object="residentSelected" 
                search-fields="name"
                title-field="name"
                minlength="1"
                remote-api-handler="searchApi"
                remote-url-response-formatter="searchResponseFormatter"
                input-class="form-control form-control-small"
                match-class="highlight"
                clear-selected="true">
        </div>
    </div>
</div>

我的进一步要求是在名称字段下方的其他输入标签上设置所选对象的字段如何通过模型绑定在resident(iterator) 上设置字段。

我无法在 augucomplete-alt 上设置 ng-model，以便它反映在 ng-repeat 的 resident(iterator) 上。

我的目标是能够从 angucomplete 标签本身将值分配/绑定到resident。

谁能帮我提前谢谢。

Answer 1

你只需要这样做......

           <angucomplete-alt 
            placeholder="Name"
            pause="100"
            selected-object="residentSelected" 
            search-fields="name"
            title-field="name"
            minlength="1"
            remote-api-handler="searchApi"
            remote-url-response-formatter="searchResponseFormatter"
            input-class="form-control form-control-small"
            match-class="highlight"
            clear-selected="true"
            override-suggestions="true"/>

override-suggestions="true" ：此属性会覆盖您的选择并将您的 selected-object 属性设置为您在字段中键入的自定义输入。

这是它的文档Link

Answer 2

使用覆盖建议。 看看这个例子 4

http://ghiden.github.io/angucomplete-alt/#example4

这是一个使用 ng-repeat 的工作示例

http://plnkr.co/edit/6IiUul?p=preview

$scope.residentSelected = function(selected) {
  if (selected.originalObject.name) {
    $scope.vm.residents[this.$parent.$index].name = selected.originalObject.name;
  } else {
    console.log('overriding selection');
    $scope.vm.residents[this.$parent.$index].name = selected.originalObject;
  }
}