Question

这很奇怪......我第一次输入输入框时，会弹出预先输出模板，但会显示为空。但如果退格并再次执行...那么模板就会填充。就像typeahead-template-url存在某种竞争条件一样。 Ater认为，问题会消失，直到下一页刷新。有什么想法吗？

angular.module("main.loadbalancer").controller("BindNodeCtrl", function($scope, $modalInstance, VipService, NodeService, Account, StatusTrackerService) {
  (function(promise) {
    return $scope.getNodeLabel = function(val) {
      return promise.then(function(nodes) {
        var dropDownItems;
        dropDownItems = [];
        _.forEach(nodes, function(node) {
          if (_.str.include(node.id.toLowerCase(), val.toLowerCase())) {
            return dropDownItems.push({
              label: node.label,
              address: node.address,
              port: node.port_number,
              value: node.id,
            });
          }
        });
        return _.sortBy(dropDownItems, 'label');
      });
    };
  })(NodeService.getNodes());

  <input  type="text" id="label" name="label" ng-model="$parent.node.id" typeahead-min-length="1"
               placeholder="Node Name / Label"
               typeahead-editable="false"
               typeahead="dropDownItem as dropDownItem.label for dropDownItem in getNodeLabel($viewValue)"
               typeahead-template-url="typeahead/bind-node.html" style="width:100%;"
               typeahead-loading="loadingNodeLabels" class="form-control" required>

<script type="text/ng-template" id="typeahead/bind-node.html">
<a><i>{{match.model.label}} &mdash; {{match.model.address}} &mdash; {{match.model.port}}</i></a>
</script>

Answer 1

我今天刚遇到这个问题，并发现问题是模板文件中内容周围的脚本标记。只有在内嵌模板时才需要脚本标记。如果模板位于外部文件（例如您的文件）中，则应删除脚本标记。我不确定他们为什么会导致退格错误，但删除脚本标签为我解决了这个问题。我希望这对你也有帮助，也许其他人可以在幕后发布一些事情，以便首先实现这一目标。

Angular UI Bootstrap Typeahead模板显示空但只是第一次

1 个答案: