angularjs的搜索建议功能不起作用答案

【问题标题】：search suggestion functionality with angularjs not workingangularjs的搜索建议功能不起作用
【发布时间】：2017-07-08 12:27:35
【问题描述】：

我正在尝试在我的系统上运行以下代码，但无法获得结果。但我在运行的 js fiddler 上运行的代码相同。

这是我的 index.html

<div ng-app="myApp" ng-controller="myCtrl">
<div ng-app>
    <div ng-controller="MyController">
        <input type="search" ng-model="search" placeholder="Search...">
        <ul>
            <li ng-repeat="name in names | filter:search">
                {{ name }}
            </li>
        </ul>
    </div>
</div>

script.js

var app = angular.module('MyModule', []);

app.controller('DefaultCtrl', function($scope) {
    $scope.names = ["john", "bill", "charlie", "robert", "alban", "oscar", "marie", "celine", "brad", "drew", "rebecca", "michel", "francis", "jean", "paul", "pierre", "nicolas", "alfred", "gerard", "louis", "albert", "edouard", "benoit", "guillaume", "nicolas", "joseph"];
});

app.directive('autoComplete', function($timeout) {
    return function(scope, iElement, iAttrs) {
            iElement.autocomplete({
                source: scope[iAttrs.uiItems],
                select: function() {
                    $timeout(function() {
                      iElement.trigger('input');
                    }, 0);
                }
            });
    };
});

如果我输入“A”，我也想得到完全匹配，只有以字母“A”开头的单词，依此类推......

【问题讨论】：

它给出一个错误 TypeError: iElement.autocomplete is not a function
我不确定它是否相关，但是您在 HTML 和 JS 文件中的 ng-controller 名称不同。

标签： angularjs json angularjs-scope angularjs-ng-repeat

【解决方案1】：

将其替换为您的 index.html

<div ng-app="MyModule">
    <div ng-controller="DefaultCtrl">
        <input type="search" ng-model="search" placeholder="Search...">
        <ul>
            <li ng-repeat="name in names | filter:search">
                {{ name }}
            </li>
        </ul>
    </div>
</div>

【讨论】：

它将如何工作

【解决方案2】：

据我所知，您将控制器命名为 DefaultCtrl，并使用 HTML 你在打电话

<div ng-controller="MyController">

所以更改它以匹配控制器名称，即

<div ng-controller="DefaultCtrl">

【讨论】：