Bootstrap typeahead不适用于ng-model

时间:2015-10-21 04:05:49

标签: angularjs twitter-bootstrap

我有一个文本框来指定国籍。我正在使用Bootstrap typeahead。

<input type="text" class="form-control" ng-model="nationality" placeholder="Enter Country" data-provide="typeahead" data-items="5" autocomplete="off" data-source='["Afghanistan","Australia","Bangladesh",
"Brazil","Britan","Canada","China","Denmark","Egypt","France",
"Germany","India","Indonesia","Iran","Iraq",
"Isrel","Italy","Japan","Nepal","Pakistan","Sri Lanka",
"United States","New Zealand","South Africa","Russia","South Korea","Sapin","Chilie","Sweeden"]'>

我将ng-model数据发布到控制器,就像任何其他文本框数据一样。弹出即将选择国家,但国家名称不与ng-model绑定。我输入键盘的字符是绑定的。

例如 - 如果我输入In,我可以选择India但只有In与ng-model绑定。

1 个答案:

答案 0 :(得分:0)

试试这个

<input type="text" class="form-control" ng-model="nationality" placeholder="Enter Country" id="country" data-provide="typeahead" data-items="5" autocomplete="off">

和Js part

<script>

    var data = ["Afghanistan","Australia","Bangladesh",
    "Brazil","Britan","Canada","China","Denmark","Egypt","France",
    "Germany","India","Indonesia","Iran","Iraq",
    "Isrel","Italy","Japan","Nepal","Pakistan","Sri Lanka",
    "United States","New Zealand","South Africa","Russia","South Korea","Sapin","Chilie","Sweeden"];   
    $('#country').typeahead({source: data}) 

</script>

打字工作example