Question

我遇到了输入问题。当用户输入一些输入时，我想用我的服务类获取Account对象列表。我需要存储帐户对象的Id以在不同的操作中使用它我已经看到很多问题已经解决了，我尝试应用解决方案，但我的服务电话甚至没有被触发。好像输入没有提供功能。有人能指出我正在制造什么荒谬的错误。
Ta

    var myCtrl = angular.module('myControllers', ['myApp.myServices', 'ui.bootstrap'])
.controller('myController', function ($scope, $q, $filter, myService) {
    $scope.selectedAccount = undefined;
    $scope.loadingAccounts =false;
    $scope.getAccounts = function(viewVal){
            $scope.loadingAccounts = true;
            console.log('I wish I saw this in logs : getAccounts for search terms '+ viewVal);
            myService.searchAccounts(viewVal)
            .then( 
                function (accountsList) {
                       $scope.loadingAccounts = false;
                       return accountsList;
                },
                function (errorMessage) {
                      $scope.loadingAccounts = false;
                }
            );
    };

}

和页面

<input type="text" id="customer" placeholder="Search Accounts" 
                     ng-model="selectedAccount" typeahead-min-length="2" typeahead-wait-ms="300"
                    typeahead="account as account.Name for account in getAccounts($viewValue)" />
                    <i ng-show="loadingAccounts" class="glyphicon glyphicon-refresh"></i>

我研究的链接link 1
例如jsfiddle
博客 with delay attribute used
示例plunker

Answer 1

getAccounts（）函数不返回任何内容;只有来自服务调用的嵌入式函数才有，所以我不希望typeahead属性有任何东西要循环。我猜了一下，但首先我要添加一个accountsList变量：

$scope.accountsList = [];

然后修改服务结果函数以将accountsList保存到$ scope变量中：

function (accountsList) {
    $scope.loadingAccounts = false;
    $scope.accountsList = accountsList;
},

在输入中，一定要循环遍历accountsList;不是函数调用：

typeahead="account as account.Name for account in accountsList" />

我怀疑你想要在输入上使用某种类型的更改事件来触发服务调用：

ng-change="getAccounts($viewValue)"

编辑：在快速查看当前版本的UI Bootstrap的文档后，您可以从getAccounts函数返回一个promise对象：

$scope.getAccounts = function(viewVal){
            $scope.loadingAccounts = true;
            console.log('I wish I saw this in logs : getAccounts for search terms '+ viewVal);
                // add a return statement here
                return myService.searchAccounts(viewVal)
                .then( 
                    function (accountsList) {
                           $scope.loadingAccounts = false;
                           return accountsList;
                    },
                    function (errorMessage) {
                          $scope.loadingAccounts = false;
                    }
                );
        };

Answer 2

愚蠢的我uib-typeahead而不是typeahead =做了诀窍： - ）

AngularJS BootstrapUI Typeahead with object - 未调用服务

2 个答案: