Javascript 为什么角度标记中的typeahead起作用

我有以下代码

<form ng-controller="emailViewController">
   <tags options="{addable: true}" placeholder="To" typeahead-options="typeaheadOpts" data-model="information.select" data-src="toPerson as toPerson for toPerson in to" style="width:95%;"></tags>
</form>

我有以下问题：

1）

然后

回调中的

$scope.to

变量包含一个类似so

[“美国”、“澳大利亚”、“加拿大”、“迪拜”]

的数组。在回调函数之后，我将

$scope.to的值重新定义为
[“John”]
。但是，当我在
标记
元素中键入
a
时，仍然会看到
typeahead
建议我选择
America
或
Australia
。当我键入
j
时，
John
不会作为选项出现。是什么导致了这种行为

为了避免混淆，我想明确一点，我的应用程序运行得非常好。我只是想了解这种行为，因为我不希望我的应用程序在将来崩溃

2） 当我按如下方式更改代码时，没有任何内容显示为来自
typeahead

emailViewController.js

'use strict';

var emailViewController = function (fetchDataService,
                                    $scope,$filter) {

    var url = 'app/mock/emails.json';
    fetchDataService.getContent(url)
        .then(function(response){
            $scope.emails = response.data;
            $scope.to = [];

            angular.forEach($scope.emails, function(key) {
               $scope.to.push(key.to);
            });
        });

      $scope.to = ["John"];
};
angular.module('iisEmail')
    .controller ('emailViewController',
    ['fetchDataService', '$scope','$filter', emailViewController]);
}());

   'use strict';

    var emailViewController = function (fetchDataService,
                                        $scope,$filter) {

        var url = 'app/mock/emails.json';
        fetchDataService.getContent(url)
            .then(function(response){
                $scope.emails = response.data;
                $scope.to = [];

                angular.forEach($scope.emails, function(key) {
                   $scope.to.push(key.to);
                });
            });
    };
    angular.module('iisEmail')
        .controller ('emailViewController',
        ['fetchDataService', '$scope','$filter', emailViewController]);
}());

因此，删除
$scope.to=[“John”]
会破坏代码。有人知道为什么会发生这种情况吗？
http服务异步运行请求并返回一个承诺

代码的执行顺序如下

fetchDataService.getContent(url)

然后继续函数的其余部分

 $scope.to = ["John"];

然后，请求完成，承诺解决

    .then(function(response){
            $scope.emails = response.data;
            $scope.to = [];

            angular.forEach($scope.emails, function(key) {
               $scope.to.push(key.to);
            });
        });

删除$scope.to=[“John”]意味着$scope.to未定义，这很可能是typeahead失败的原因。您正在对未定义的对象进行迭代

尝试这样做：

'use strict';

var emailViewController = function (fetchDataService,
                                $scope,$filter) {

var url = 'app/mock/emails.json';
$scope.to = [];
fetchDataService.getContent(url)
    .then(function(response){
        $scope.emails = response.data;

        angular.forEach($scope.emails, function(key) {
           $scope.to.push(key.to);
        });
    });


};
angular.module('iisEmail')
    .controller ('emailViewController',
    ['fetchDataService', '$scope','$filter', emailViewController]);
}());

通过这种方式，您可以将数组初始化为一个空列表，稍后当http请求完成时，您可以从服务器获取元素列表

另外，请查看angular$q以了解angular中承诺的更多信息。
http服务异步运行请求并返回承诺

代码的执行顺序如下

fetchDataService.getContent(url)

然后继续函数的其余部分

 $scope.to = ["John"];

然后，请求完成，承诺解决

    .then(function(response){
            $scope.emails = response.data;
            $scope.to = [];

            angular.forEach($scope.emails, function(key) {
               $scope.to.push(key.to);
            });
        });

删除$scope.to=[“John”]意味着$scope.to未定义，这很可能是typeahead失败的原因。您正在对未定义的对象进行迭代

尝试这样做：

'use strict';

var emailViewController = function (fetchDataService,
                                $scope,$filter) {

var url = 'app/mock/emails.json';
$scope.to = [];
fetchDataService.getContent(url)
    .then(function(response){
        $scope.emails = response.data;

        angular.forEach($scope.emails, function(key) {
           $scope.to.push(key.to);
        });
    });


};
angular.module('iisEmail')
    .controller ('emailViewController',
    ['fetchDataService', '$scope','$filter', emailViewController]);
}());

通过这种方式，您可以将数组初始化为一个空列表，稍后当http请求完成时，您可以从服务器获取元素列表

另外，请查看angular$q，了解angular中承诺的更多信息