角度全能自动完成

Question

我试图改变全能自动完成来接受一个对象数组而不仅仅是一个字符串数组.但遗憾的是,我处于停滞状态.

在这里,我想要一个数组来包含对象而不是app.js中的字符串

MovieRetriever.getmovies = function(i) {
var moviedata = $q.defer();
var movies;

var moreMovies = [{id: "0", name: "someMovie"}, {id: "1", name: "anotherMovie"}, {id: "2", name: "aMovie"}];

// var moreMovies = ["The Wolverine", "The Smurfs 2", "The Mortal Instruments: City of Bones"]

if(i && i.indexOf('T')!=-1)
  movies=moreMovies;
else
  movies=moreMovies;

$timeout(function(){
  moviedata.resolve(movies);
},1000);

return moviedata.promise

但是当我这样做时,我会受到诸如此类错误的惩罚

错误:[$ sce:itype] http://errors.angularjs.org/1.2.12/ $ sce/itype？p0 = html

我怀疑它来自autocomplete.js中的这个区域

template: '\
    <div class="autocomplete {{ attrs.class }}" id="{{ attrs.id }}">\
      <input\
        type="text"\
        ng-model="searchParam"\
        placeholder="{{ attrs.placeholder }}"\
        class="{{ attrs.inputclass }}"\
        id="{{ attrs.inputid }}"/>\
      <ul ng-show="completing">\
        <li\
          suggestion\
          ng-repeat="suggestion in suggestions | filter:searchFilter | orderBy:\'toString()\' track by $index"\
          index="{{ $index }}"\
          val="{{ suggestion }}"\
          ng-class="{ active: ($index === selectedIndex) }"\
          ng-click="select(suggestion)"\
          ng-bind-html="suggestion | highlight:searchParam"></li>\
      </ul>\
    </div>'

和这里

app.filter('highlight', ['$sce', function ($sce) {

我打算在这里粘贴更多代码,但是编辑器会在我身上耍花招.这是我的第一个问题,我将不得不放弃它.

请点击顶部的链接查看完整的代码示例,看看您是否可以帮助我

Answer 1

只是一个问题：为什么不使用http://angular-ui.github.io/bootstrap/#/typeahead

<h4>Custom templates for results</h4>
<pre>Model: {{customSelected | json}}</pre>
<input type="text" ng-model="customSelected" placeholder="Custom template" typeahead="state as state.name for state in statesWithFlags | filter:{name:$viewValue}" typeahead-template-url="customTemplate.html" class="form-control">

我认为这对你来说更干净/更容易。 http://plnkr.co/edit/?p=preview