我一直在努力解决AngularJS问题。我想加载自定义组件,然后调用它们的功能但是还没有设法找到方法。
在下面的代码中,我尝试在项目成功发布后显示SweetAlert(http://t4t5.github.io/sweetalert/)。
function config($ stateProvider,$ urlRouterProvider,$ ocLazyLoadProvider){ $ urlRouterProvider.otherwise(" /索引/主&#34);
$ocLazyLoadProvider.config({
// Set to true if you want to see what and when is dynamically loaded
debug: false
});
$stateProvider
....
.state('index.item', {
url: "/:itemId/edit",
templateUrl: "views/item-edit.html",
data: {pageTitle: 'Edit Item'},
controller: function ($scope, $http, $stateParams, $rootScope, $state, $modal, $log, $ocLazyLoad) {
//console.log($routeParams.itemId);
var demo1 = function () {
SweetAlert.swal({
title: "Welcome in Alerts",
text: "Lorem Ipsum is simply dummied text of the printing and typesetting industry."
});
}
$scope.updateItem = function() {
$log.log('Submiting item info');
$http.post('/api/item', $scope.item)
.success(function(data) {
demo1();
})
.error(function(data) {
console.log('Error: ' + data);
});
}
},
resolve: {
loadPlugin: function ($ocLazyLoad) {
return $ocLazyLoad.load([
{
files: ['js/plugins/sweetalert/sweetalert.min.js', 'css/plugins/sweetalert/sweetalert.css']
},
{
name: 'oitozero.ngSweetAlert',
files: ['js/plugins/sweetalert/angular-sweetalert.min.js']
}
]);
}
}
})
在尝试使用上面的代码时,我收到以下错误:
ReferenceError: SweetAlert is not defined
at demo1 (config.js:156)
at config.js:170
at angular.js:9354
at angular.js:13168
at l.$eval (angular.js:14381)
at l.$digest (angular.js:14197)
at l.$apply (angular.js:14486)
at l (angular.js:9644)
at O (angular.js:9834)
at XMLHttpRequest.w.onload (angular.js:9775)
主要原因可能是属性loadPlugin,它在控制器内的任何地方都没有被调用。有人知道如何修改代码以加载已定义的插件并在控制器中使用它们吗?
谢谢!
答案 0 :(得分:2)
问题在您的错误中明确写明。
<强> SweetAlert is not defined
强>
这意味着您在控制器中忘记将SweetAlert
添加到依赖项中。
只需将SweetAlert添加到您的conrtoller行的末尾:
controller: function ($scope, ... $ocLazyLoad, SweetAlert) {