嗨,我正在尝试在路线导航上加载组件。原因是组件的html页面大于1 mb。如果我在加载时加载它会减慢UI速度,那么我只想在用户单击特定路线后加载该组件
任何示例都会有所帮助。您可以检查下面我正在尝试的代码。让我知道解决方法。
aboutus-component.js
import AboutUsCtrl from './aboutus-controller'
export const AboutUsComponent = {
controllerAs : 'vm',
controller:AboutUsCtrl,
templateUrl: './aboutus.html'
}
aboutus-module.js
import angular from 'angular'
import {AboutUsComponent} from './aboutus-component.js'
(function(){
angular.module('analyzerApp')
.component('aboutus',AboutUsComponent)
.name
})();
现在点击“关于我们”标签
import(/* webpackChunkName: 'aboutus' */'../app/aboutus-main.js').then(() => {
setTimeout(()=>{
$state.go('aboutus', { reload: false });
},2000)
//window.location.href="#/aboutus"
})
aboutus-main.js
importModules(
require.context('./', true, /^(.*(aboutus)\.js)((?!.*\.(js\.*))$)/i)
);
/**
* Dynamically imports modules
* @param request
*/
function importModules(request){
request.keys().forEach(request);
}
遇到此错误
angular-ui-router.js:3251 Uncaught Error: Could not resolve 'aboutus' from state 'home'
at Object.transitionTo (angular-ui-router.js:3251)
at Object.$state.transitionTo (ct-ui-router-extras.js:201)
at Object.$state.transitionTo (ct-ui-router-extras.js:1599)
at Object.$state.transitionTo (ct-ui-router-extras.js:1084)
at Object.go (angular-ui-router.js:3179)
at ni-footer.js:38