我是使用 angular.module methods 初始化 Angular 应用程序的新手。 。我没有收到任何错误消息,但是,链接到我的状态的模板未加载。
//APP.JS
var libraries = ['ui.router','layout'];
// DECLARATION
var opsManagement = angular.module('opsMgmt',libraries);
opsManagement.config(appConfig);
opsManagement.run(($state)=>{
//FORCE STATE CHANGE
$state.go('message');
console.log($state.current); //message
console.log($state.name); //message
console.log($state.templateUrl); //template/messages/layout.html
});
angular.bootstrap(document,['opsMgmt']);
//CONFIG.JS
function appConfig($stateProvider){
//DEFINE ROUTER
$stateProvider
.state('message',{
url:'message',
templateUrl: '/templates/messages/layout.html'
})
};
//INDEX.HTML
<body>
<main ui-view></main>
</body>
//布局.HTML
<div>
<!-- MESSAGE VIEW COMPONENT DIRECTIVE -->
<message-item></message-item>
</div>
这里是 GitHub 上完整源代码的链接.
问题:为什么我的模板 templates/messages/layout.html
没有加载到页面中?
最佳答案
问题(可能)是您在文档加载之前尝试引导 Angular 应用。
这解决了它
angular.element(document).ready(() => {
angular.bootstrap(document,['opsMgmt']);
})
http://plnkr.co/edit/QYklvwMLhJP524qWnfRa?p=preview
另一种方法是将脚本移至 <body>
的末尾标签。
我还清理了您的路线定义并删除了 .run
调用
function appConfig($stateProvider, $urlRouterProvider){
//DEFINE ROUTER
$stateProvider
.state('message',{
url:'/message', // note the leading "/"
templateUrl: 'templates/messages/layout.html',
controller: function() {
console.log('Got in here')
}
});
$urlRouterProvider.otherwise('/message'); // default route defined here
}
关于javascript - $state.go 没有获取模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42015181/