Angular ui-select $injector:unpr 错误
Angular ui-select $injector:unpr error
我试图在我的系统中使用 ui-select
模块,我注入了 ui-module
和 ngSanitize
angular.module('app', ['ngSanitize', 'ui.select']);
并将他们的 JS
文件包含在 HTML
中:
<link rel="stylesheet" href="/local/mentoring/assets/ui-select/dist/select.min.css">
<script src="/local/mentoring/assets/ui-select/dist/select.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-sanitize.js"></script>
<div ng-controller="ctrl">
<ui-select ng-model="selected.value">
<ui-select-match>
<span ng-bind="$select.selected.name"></span>
</ui-select-match>
<ui-select-choices repeat="item in (itemArray | filter: $select.search) track by item.id">
<span ng-bind="item.name"></span>
</ui-select-choices>
</ui-select>
</div>
我的 JS:
angular.module('app')
.controller('ctrl', ['$scope', function ($scope){
$scope.itemArray = [
{id: 1, name: 'first'},
{id: 2, name: 'second'},
{id: 3, name: 'third'},
{id: 4, name: 'fourth'},
{id: 5, name: 'fifth'},
];
$scope.selectedItem = $scope.itemArray[0];
}]);
但是当我使用该指令时,向我报告以下错误:
我的代码有什么问题?
更新 1:
我将 angular.min.js
更改为 angular.js
,然后我的控制台报告以下错误:
尝试更新ui.select版本。这是一个可行的解决方案。
演示
var myApp = angular.module('myApp', ['ngSanitize', 'ui.select']);
myApp.controller('Controller', ['$scope',
function($scope) {
$scope.itemArray = [{
id: 1,
name: 'first'
}, {
id: 2,
name: 'second'
}, {
id: 3,
name: 'third'
}, {
id: 4,
name: 'fourth'
}, {
id: 5,
name: 'fifth'
}, ];
$scope.selectedItem = $scope.itemArray[0];
}
]);
<!DOCTYPE html>
<html>
<head>
<script src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
<script src="https://code.angularjs.org/1.4.0-beta.6/angular-sanitize.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.20.0/select.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.20.0/select.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="Controller">
<ui-select ng-model="selected.value">
<ui-select-match>
<span ng-bind="$select.selected.name"></span>
</ui-select-match>
<ui-select-choices repeat="item in (itemArray | filter: $select.search) track by item.id">
<span ng-bind="item.name"></span>
</ui-select-choices>
</ui-select>
</div>
</body>
</html>
我试图在我的系统中使用 ui-select
模块,我注入了 ui-module
和 ngSanitize
angular.module('app', ['ngSanitize', 'ui.select']);
并将他们的 JS
文件包含在 HTML
中:
<link rel="stylesheet" href="/local/mentoring/assets/ui-select/dist/select.min.css">
<script src="/local/mentoring/assets/ui-select/dist/select.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-sanitize.js"></script>
<div ng-controller="ctrl">
<ui-select ng-model="selected.value">
<ui-select-match>
<span ng-bind="$select.selected.name"></span>
</ui-select-match>
<ui-select-choices repeat="item in (itemArray | filter: $select.search) track by item.id">
<span ng-bind="item.name"></span>
</ui-select-choices>
</ui-select>
</div>
我的 JS:
angular.module('app')
.controller('ctrl', ['$scope', function ($scope){
$scope.itemArray = [
{id: 1, name: 'first'},
{id: 2, name: 'second'},
{id: 3, name: 'third'},
{id: 4, name: 'fourth'},
{id: 5, name: 'fifth'},
];
$scope.selectedItem = $scope.itemArray[0];
}]);
但是当我使用该指令时,向我报告以下错误:
我的代码有什么问题?
更新 1:
我将 angular.min.js
更改为 angular.js
,然后我的控制台报告以下错误:
尝试更新ui.select版本。这是一个可行的解决方案。
演示
var myApp = angular.module('myApp', ['ngSanitize', 'ui.select']);
myApp.controller('Controller', ['$scope',
function($scope) {
$scope.itemArray = [{
id: 1,
name: 'first'
}, {
id: 2,
name: 'second'
}, {
id: 3,
name: 'third'
}, {
id: 4,
name: 'fourth'
}, {
id: 5,
name: 'fifth'
}, ];
$scope.selectedItem = $scope.itemArray[0];
}
]);
<!DOCTYPE html>
<html>
<head>
<script src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
<script src="https://code.angularjs.org/1.4.0-beta.6/angular-sanitize.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.20.0/select.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.20.0/select.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="Controller">
<ui-select ng-model="selected.value">
<ui-select-match>
<span ng-bind="$select.selected.name"></span>
</ui-select-match>
<ui-select-choices repeat="item in (itemArray | filter: $select.search) track by item.id">
<span ng-bind="item.name"></span>
</ui-select-choices>
</ui-select>
</div>
</body>
</html>