Question

任何人使用angular-ui-select时遇到问题？

获取此错误

GET http://localhost/select2/select.tpl.html 404 (Not Found) angular.js:8539
Error: [$compile:tpload] Failed to load template: select2/select.tpl.html

从文档中 - 我只需要引用select.js和select.css

Answer 1

尝试使用/ dist目录中的select.css和select.js文件，而不是/ src目录中的文件。

Answer 2

您还需要模板 - 查看src文件夹。有3个主题。

当您在页面中包含select时，您可以指定要使用的页面：

<ui-select ng-model="boo.selected" theme="resources/templates/select2" ng-disabled="disabled">

上面我将路径放到模板

Answer 3

您收到此错误，因为错误消息中的模板未加载到templateCache中。您可能正在使用不包含模板的select.js版本。

您还会发现并非每种模板设计都适用于每种选择类型。例如。没有用于多选的Selectize模板，这也可能导致类似的错误。

如果您查看select.js source的结尾，您将看到如何加载模板甚至定义自己的模板。

在你的情况下：

angular.module("ui.select").run(["$templateCache", function($templateCache){
    $templateCache.put("select2/select.tpl.html","<div class=\"ui-select-container select2 select2-container\" ng-class=\"{\'select2-container-active select2-dropdown-open open\': $select.open,\n \'select2-container-disabled\': $select.disabled,\n \'select2-container-active\': $select.focus, \n \'select2-allowclear\': $select.allowClear && !$select.isEmpty()}\"><div class=\"ui-select-match\"></div><div class=\"select2-drop select2-with-searchbox select2-drop-active\" ng-class=\"{\'select2-display-none\': !$select.open}\"><div class=\"select2-search\" ng-show=\"$select.searchEnabled\"><input type=\"text\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\" class=\"ui-select-search select2-input\" ng-model=\"$select.search\"></div><div class=\"ui-select-choices\"></div></div></div>");
}]);

Angular ui-select错误：404（无法加载模板）

3 个答案: