Question

我写了一个小的HTML代码

 <!DOCTYPE html(ng-app)><html><head><title>Express</title>
<link rel="stylesheet" href="/stylesheets/style.css"/>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script src="/javascripts/ui-bootstrap-tpls-0.11.0.min.js"></script><script src="/javascripts/customjs.js"></script>
</head>
<body>
<h1>Weather Forecasting</h1>
<div ng-controller="TypeaheadCtrl"><form><input type="text" ng-model="selected" typeahead="state for state in states| filter:$viewValue | limitTo:8" class="form-control"/>

</form></div></body></html>

和customjs.js文件代码是

function TypeaheadCtrl($scope, $http) {

  $scope.selected = undefined;
  $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];
  // Any function returning a promise object can be used to load values asynchronously


}

但是typeahead没有显示其自动完成行为任何人都可以告诉为什么它没有显示建议??

Answer 1

以下是工作Plunker Example using typeahead

的示例

您需要在customjs.js

中注入angular.module('sample', ['ui.bootstrap']);

同样在html中你需要使用某个名称启动角度应用程序，因为你想使用ui.bootstrap模块，其中typeahead就是其中之一。

<html  ng-app="sample"><head><title>Express</title>

如果您仍然遇到问题，请告诉我。

typeahead在Angularjs中不起作用

1 个答案: