Question

我无法在angular-bootstrap中获得typeahead功能，无法在简单的自然生成环境中工作。我期待的是能够开始在输入字段中输入并且下拉显示匹配输入字段中输入的字符的匹配项。要匹配的项目集是['alpha'，'beta'，'gamma'，'delta']，但是如果我输入a，则没有任何显示但是它们都应该显示，因为a对所有人都是通用的。感谢任何帮助。

以下是我设置测试应用程序的步骤：

$ yo angular
Include twitter bootstrap Y
Twitter bootstrap with Compass N
Included all modules and took defaults for the rest

$ bower install angular-bootstrap --save

$ bower install angular-ui-bootstrap --save

已编辑的app / views / main.html（代码段）：

            <div class="jumbotron">
                <h1>'Allo, 'Allo!</h1>
                <p class="lead">Always a pleasure scaffolding your apps.</p>
                <p><a class="btn btn-lg btn-success" href="#">Splendid!</a></p>
            </div>

            <!-- Added this to verify that $scope.shows is available (and it is) -->
            <h2>Shows</h2>
            <ul ng-repeat="show in shows">
            <li>{{show}}</li>
            </ul>

            <!-- This is what is not working -->
            <h2>typeahead</h2>
            <input type="text" ng-model="selected" typeahead="show for show in shows | filter:$viewValue | limitTo:8" class="form-control">

            <div class="row marketing">
                <h4>HTML5 Boilerplate</h4>

已编辑的app / scripts / controllers / main.js：

            'use strict';

            angular.module('wtfoApp', ['ui-bootstrap'])
              .controller('MainCtrl', function ($scope) {
                $scope.awesomeThings = [
                  'HTML5 Boilerplate',
                  'AngularJS',
                  'Karma'
                ];
                $scope.shows = ['alpha', 'beta', 'gamma', 'delta'];
              });

非常感谢。

编辑：忘记依赖[ui-bootstrap]。它可能是我的问题的解决方案，但我无法添加它。 Firebug抱怨它无法找到ui-bootstrap。我也试过[bower_components / angular-bootstrap / ui-bootstrap]和[bower_components / angular_bootstrap]。虽然已经晚了所以我早上必须再次拿起它。

编辑2：跟随vucalur建议添加angular-ui-bootstrap。这在bower_components / angular-ui-bootstrap

下添加了一个模板文件夹

做出这样的改变：[ui-bootstrap] - ＆gt; [ 'UI的自举']。没有页面显示，Firebug出错：

[$ injector：modulerr]由于以下原因无法实例化模块ui-bootstrap：[$ injector：nomod]模块'ui-bootstrap'不可用！您要么错误拼写了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

编辑3：通过重新运行yo和bower进行重构（与bower尝试添加--save开关）。结果相同。这就像有一个类似于类路径的东西，它不允许我在bower_components中引用依赖项。

Answer 1

尝试使用ui.bootstrap代替ui-bootstrap：您需要一段时间，而不是短划线。

Answer 2

查看this提交。（如果我们进行一些重新定位并且链接不再有效：https://github.com/vucalur/django-wibses，“feat（令牌 - 下拉列表）...”提交。）

该项目使用自耕农。
这是CoffeeScript＆amp; Python在后端，但我希望你能得到它。
项目是从服务器获得的 - JSONP和$http承诺api来玩，但如果你有客户端的项目，你可能不会需要它。
另请注意，您无需使用angular-ui-bootstrap的bootstrap3分支。
依赖关系为"angular-ui-bootstrap": "~0.9.0"，而不是angular-boostrap。至少那对我有用。

angular-bootstrap中的Typeahead插件对我不起作用

2 个答案: