1

這是完全有可能的,我做了一些愚蠢的......錯誤的 完整堆棧跟蹤ng:btstrpd err應用程序已經用此元素引導?

Error: [ng:btstrpd] App Already Bootstrapped with this Element < html class="js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths ng-scope mdl-js js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache

此錯誤是在我的index.html file.by默認我的路由存在的到login.html.it那張在連續循環中,許多ng-view被創建。 這是我的script.js和index.html

// create the module and name it app 
 
var app = angular.module('app', ['ngRoute','luegg.directives']); 
 

 
// configure our routes 
 
app.factory("Data", function(){ 
 
var pagesData = {}; 
 
var loginData = {}; 
 
var data = {}; 
 
// var setPageName = function(x){ 
 
// pagesData.pageName = x; 
 
// console.log(x); 
 
// }; 
 
// 
 
// var setPageId = function(x){ 
 
// pagesData.pageId = x; 
 
// console.log(x); 
 
// }; 
 
// var getPageData = function(){ 
 
// return pagesData; 
 
// }; 
 
// return {pageData : pagesData.pageName}; 
 
return { 
 

 
getpageData : function() { 
 
    console.log(pagesData); 
 
    return pagesData; 
 
}, 
 

 
setPageName : function (name) { 
 
    pagesData.pageName = name; 
 
    console.log("1111111111111"); 
 
    console.log(pagesData); 
 
}, 
 
setPageId : function (id) { 
 
    pagesData.pageId = id; 
 
    console.log("1111111111111"); 
 
    console.log(pagesData); 
 
}, 
 
setUserName : function (name) { 
 
    loginData.userName = name; 
 
    console.log("1111111111111"); 
 
    console.log(pagesData); 
 
}, 
 
setUserEmail : function (mail) { 
 
    loginData.userEmail = mail; 
 
    console.log("1111111111111"); 
 
    console.log(pagesData); 
 
}, 
 
getLoginData : function() { 
 
    console.log(pagesData); 
 
    return loginData; 
 
} 
 

 

 
} 
 
}); 
 
app.config(function($routeProvider) { 
 
    $routeProvider 
 
 
    \t \t .when('/', { 
 
\t \t \t \t templateUrl : 'login-2.html', 
 
\t \t \t \t controller : 'loginCtrl' 
 
\t \t \t }) 
 

 
     .when('/page', { 
 
\t \t \t \t templateUrl : 'pages.html', 
 
\t \t \t \t controller : 'myPagesCtrl' 
 
\t \t \t }) 
 

 
\t \t \t .when('/try', { 
 
\t \t \t \t templateUrl : 'try.html', 
 
\t \t \t \t controller : 'myctrl' 
 
\t \t \t }); 
 

 
}); 
 
app.controller('myPagesCtrl', function($scope) { 
 
\t \t // create a message to display in our view 
 
\t \t $scope.message = 'Everyone come and see how good I look!'; 
 
\t }); 
 

 
\t app.controller('myctrl', function($scope) { 
 
\t \t $scope.message = 'Look! I am an about page.'; 
 
\t }); 
 

 
    app.controller('mainController', function($scope,$location) { 
 
\t scope.message = 'Look! I am an about page.'; 
 
\t });
<!DOCTYPE html> 
 
<html lang="en" ng-app="app" ng-controller="mainController"> 
 
<head> 
 

 
    <meta charset="UTF-8"> 
 
<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]--> 
 
<title> Monarch UI - Bootstrap Frontend &amp; Admin Template </title> 
 
<meta name="description" content=""> 
 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
 
<link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.light_blue-blue.min.css" /> 
 
<script defer src="https://code.getmdl.io/1.2.1/material.min.js"></script> 
 
<!-- Favicons --> 
 

 
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../assets/images/icons/apple-touch-icon-144-precomposed.png"> 
 
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../assets/images/icons/apple-touch-icon-114-precomposed.png"> 
 
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../assets/images/icons/apple-touch-icon-72-precomposed.png"> 
 
<link rel="apple-touch-icon-precomposed" href="../../assets/images/icons/apple-touch-icon-57-precomposed.png"> 
 
<link rel="shortcut icon" href="../../assets/images/icons/favicon.png"> 
 

 

 

 
    <link rel="stylesheet" type="text/css" href="../../assets/bootstrap/css/bootstrap.css"> 
 

 

 
<!-- HELPERS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/animate.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/backgrounds.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/boilerplate.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/border-radius.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/grid.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/page-transitions.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/spacing.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/typography.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/utils.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/colors.css"> 
 

 
<!-- ELEMENTS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/elements/badges.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/buttons.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/content-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/dashboard-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/forms.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/images.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/info-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/invoice.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/loading-indicators.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/menus.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/panel-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/response-messages.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/responsive-tables.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/ribbon.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/social-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/tables.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/tile-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/elements/timeline.css"> 
 

 

 

 
<!-- ICONS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/icons/fontawesome/fontawesome.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/icons/linecons/linecons.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/icons/spinnericon/spinnericon.css"> 
 

 

 
<!-- WIDGETS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/accordion-ui/accordion.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/calendar/calendar.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/carousel/carousel.css"> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/charts/justgage/justgage.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/charts/morris/morris.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/charts/piegage/piegage.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/charts/xcharts/xcharts.css"> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/chosen/chosen.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/colorpicker/colorpicker.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/datatable/datatable.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/datepicker/datepicker.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/datepicker-ui/datepicker.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/daterangepicker/daterangepicker.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/dialog/dialog.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/dropdown/dropdown.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/dropzone/dropzone.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/file-input/fileinput.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/input-switch/inputswitch.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/input-switch/inputswitch-alt.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/ionrangeslider/ionrangeslider.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/jcrop/jcrop.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/jgrowl-notifications/jgrowl.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/loading-bar/loadingbar.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/maps/vector-maps/vectormaps.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/markdown/markdown.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/modal/modal.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/multi-select/multiselect.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/multi-upload/fileupload.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/nestable/nestable.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/noty-notifications/noty.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/popover/popover.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/pretty-photo/prettyphoto.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/progressbar/progressbar.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/range-slider/rangeslider.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/slidebars/slidebars.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/slider-ui/slider.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/summernote-wysiwyg/summernote-wysiwyg.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/tabs-ui/tabs.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/theme-switcher/themeswitcher.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/timepicker/timepicker.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/tocify/tocify.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/tooltip/tooltip.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/touchspin/touchspin.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/uniform/uniform.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/wizard/wizard.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/widgets/xeditable/xeditable.css"> 
 

 
<!-- SNIPPETS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/chat.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/files-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/login-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/notification-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/progress-box.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/todo.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/user-profile.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/snippets/mobile-navigation.css"> 
 

 
<!-- APPLICATIONS --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/applications/mailbox.css"> 
 

 
<!-- Admin theme --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/themes/admin/layout.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/themes/admin/color-schemes/default.css"> 
 

 
<!-- Components theme --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/themes/components/default.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/themes/components/border-radius.css"> 
 

 
<!-- Admin responsive --> 
 

 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/responsive-elements.css"> 
 
<link rel="stylesheet" type="text/css" href="../../assets/helpers/admin-responsive.css"> 
 

 
    <!-- JS Core --> 
 

 
    <script type="text/javascript" src="../../assets/js-core/jquery-core.js"></script> 
 
    <script type="text/javascript" src="../../assets/js-core/jquery-ui-core.js"></script> 
 
    <script type="text/javascript" src="../../assets/js-core/jquery-ui-widget.js"></script> 
 
    <script type="text/javascript" src="../../assets/js-core/jquery-ui-mouse.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/interactions-ui/sortable.js"></script> 
 
    <script type="text/javascript" src="../../assets/jquery.ns-autogrow/dist/jquery.ns-autogrow.js"></script> 
 

 
    <script type="text/javascript" src="../../assets/js-core/jquery-ui-position.js"></script> 
 
    <!--<script type="text/javascript" src="../../assets/js-core/transition.js"></script>--> 
 
    <script type="text/javascript" src="../../assets/js-core/modernizr.js"></script> 
 
    <script type="text/javascript" src="../../assets/js-core/jquery-cookie.js"></script> 
 

 

 

 

 
    <script src="https://code.angularjs.org/1.2.13/angular.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-animate.js"></script> 
 
    <script type="text/javascript" src="../../assets/angular/app.js"></script> 
 

 

 
    <link rel="stylesheet" type="text/css" href="../../assets/angular/page-animations.css"> 
 

 
    <script type="text/javascript" src="scripts/script.js"></script> 
 

 
    <script type="text/javascript" src="scripts/myPagesController.js"></script> 
 
    <script type="text/javascript" src="scripts/about.js"></script> 
 
    <script type="text/javascript" src="scripts/loginController.js"></script> 
 

 
    
 
    <script src="https://cdn.auth0.com/js/lock/10.0/lock.min.js"></script> 
 

 
    <script type="text/javascript" src="scripts/chosen-sort.js"></script> 
 
     <script type="text/javascript" src="scripts/ui-bootstrap-tpls-2.4.0.min.js"></script> 
 

 
    <script type="text/javascript" src="../../assets/widgets/chosen/chosen.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/chosen/chosen-demo.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/accordion-ui/accordion.js"></script> 
 
    <script type="text/javascript" src="../../assets/angularjs-scroll-glue/src/scrollglue.js"></script> 
 
    <script type="text/javascript" src="../../assets/angular-xeditable/js/xeditable.js"></script> 
 
    <script type="text/javascript" src="../../assets/bootstrap/js/bootstrap.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/wizard/wizard.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/wizard/wizard-demo.js"></script> 
 
    <script src="https://sdk.amazonaws.com/js/aws-sdk-2.3.0.min.js"></script> 
 
    <script type="text/javascript" src="../../assets/widgets/dropzone/dropzone.js"></script> 
 
    <script src="https://cdn.pubnub.com/pubnub.min.js"></script> 
 

 
     <script type="text/javascript" src="../../assets/widgets/tabs/tabs.js"></script> 
 
     <script type="text/javascript" src="../../assets/widgets/parsley/parsley.js"></script> 
 

 
</head> 
 

 

 
    <body> 
 
     <div ng-view> 
 

 
     </div> 
 
     <!-- <button><a href="#/pages"><i class="fa fa-home"></i> Home</a></button> 
 
     <a href="#/about"><i class="fa fa-shield"></i> About</a> --> 
 

 

 
    </body> 
 
</html>

回答

1

你的問題是這樣的:

.when('/', { 
    templateUrl : 'index.html', 
    controller : 'mainController' 
    }) 

你並不需要指定 '的index.html'這裏。 index.html將由您的服務器加載。當檢測到'/'路徑時,您需要傳遞模板文件以加載到位於index.html中的ng-view中。

編輯:正如我在評論中提到的。您的應用程序中也應該只有1 ng-app指令。該指令引導角度,只需要一次。

+0

嘿thank.tried你的answer.same正在發生。請參閱更新的script.js.do你知道這是爲什麼發生。? – kragor

+0

你在其他地方使用ng-app =「app」嗎?您是否還在任何地方使用

angular.bootstrap(document, ['app']);
?你可能會加載兩次角?這些事情也可能通過嘗試多次引導您的應用程序導致此問題。 – dmungin

+0

是的,我在login.html和index.html和try.html中使用ng-app ='app' – kragor