具有typeahead的AngularJS不适用于角度生成的动态项目

时间:2014-04-05 14:03:19

标签: angularjs

我正在尝试使用angularJS(v.1.2.15)使用typeahead(来自ngSstrap:http://mgcrea.github.io/angular-strap/##typeaheads)。我收到以下错误(列表显示但是它是空的):

Error: [$sce:unsafe] Attempting to use an unsafe value in a safe context.
http://errors.angularjs.org/1.2.15/$sce/unsafe
minErr/<@http://localhost:50445/Scripts/angular.js:78
htmlSanitizer@http://localhost:50445/Scripts/angular.js:12790
getTrusted@http://localhost:50445/Scripts/angular.js:12954
@http://localhost:50445/Scripts/angular.js:13635
ngBindHtmlWatchAction@http://localhost:50445/Scripts/angular.js:17671
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost:50445/Scripts/angular.js:12031
this.$get/TooltipFactory/$tooltip.show@http://localhost:50445/Scripts/angular-strap-tooltip.js:196
this.$get/TypeaheadFactory/$typeahead.show@http://localhost:50445/Scripts/angular-strap-typeahead.js:131
this.$get/TooltipFactory/$tooltip.enter@http://localhost:50445/Scripts/angular-strap-tooltip.js:164
jQuery.event.dispatch@http://localhost:50445/Scripts/jquery-2.1.0.js:4371
jQuery.event.add/elemData.handle@http://localhost:50445/Scripts/jquery-2.1.0.js:4057
this.$get/TooltipFactory/$tooltip.$onFocusElementMouseDown@http://localhost:50445/Scripts/angular-strap-tooltip.js:292
jQuery.event.dispatch@http://localhost:50445/Scripts/jquery-2.1.0.js:4371
jQuery.event.add/elemData.handle@http://localhost:50445/Scripts/jquery-2.1.0.js:4057

http://localhost:50445/Scripts/angular.js
Line 9563

仅当我点击使用ng-repeat创建的框时才会发生这种情况。如果我自己创建输入(以下代码的最后一行),那么一切都很好 - 没有错误,我看到了建议。这是相关的代码:

<div class="control-group children-horizontal repeat-item" data-ng-repeat="passenger in passengers">
          <!--label class="control-label" for="textinput">Departure from</label-->
            <!--span class="fleft">
                {{$index + 1}}.
            </span-->
            <div class="controls">
                <div class="input-group">
                    <input name="airports[{{$index}}]" value="{{passenger.from}}" placeholder="Departure from" class="form-control input-xlarge" type="text" data-ng-model="selectedAirport" data-min-length="0" data-html="1" data-animation="am-flip-x" data-ng-options="airport for airport in airports" data-bs-typeahead="" autocomplete="off" />
                    <span class="input-group-btn"><button type="button" class="btn" data-ng-click="removePassenger($index)"><i class="fa fa-minus"></i></button></span>
                </div>                

            </div>
        </div>

        <div class="control-group">
          <div class="controls">
            <button type="button" class="btn" data-ng-click="addPassenger()"><i class="fa fa-plus"></i> Add new passenger</button>
            <button class="btn btn-search btn-primary"><i class="fa fa-search"></i> Search for flights</button>
          </div>
</div>

<input placeholder="Departure from" class="form-control" data-animation="am-flip-x" data-ng-model="selectedAirport" data-ng-options="airport for airport in airports" data-bs-typeahead="" type="text" />

有人知道导致此错误的原因吗?

1 个答案:

答案 0 :(得分:0)

  

你可能正在使用{html:true},它依赖于ngBindHtml和   需要ngSanitize模块。

https://github.com/mgcrea/angular-strap/issues/356