angularjs 路由---angularjs 搭建前端框架
生活随笔
收集整理的這篇文章主要介紹了
angularjs 路由---angularjs 搭建前端框架
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
前端框架搭建:angularjs,nodejs 安裝,git 安裝
let toStateCache, fromStateCache, cssToBeEnableList = []export default app => {document.domain='cnsuning.com'app.config(['$stateProvider', '$urlRouterProvider', ($stateProvider, $urlRouterProvider) => {mockFn($stateProvider, 'state')// $urlRouterProvider.otherwise('/portal');let header = 'Header.';if(window != window.top){header = ''}$urlRouterProvider.otherwise(function ($injector) {var $state = $injector.get("$state");$state.go('Header.overview');});$stateProvider.state('Header', {abstract: true,cssUrl: 'business/components/headerCD/headerCD.css',templateUrl: 'business/components/headerCD/headerCD.html',controller: 'headerCD'}).state(header+'cleanup', {url: '/cleanup',templateUrl: 'business/components/cleanup/cleanup.html',cssUrl: 'business/components/cleanup/cleanup.css',controller: 'CleanUpCtrl'}).state(header+'dependency', {url: '/dependency',templateUrl: 'business/components/dependency/dependencyhigh.html',cssUrl: 'business/components/dependency/dependencyhigh.css',controller: 'DependencyCtrl'}).state(header+'logDetail', {url: '/logDetail',templateUrl: 'business/components/logDetail/logDetail.html',cssUrl: 'business/components/logDetail/logDetail.css',controller: 'logDetailCtrl'}).state(header+'overview', {url: '/overview?appId/:appName',templateUrl: 'business/components/buildRecord/buildRecordhigh.html',cssUrl: 'business/components/buildRecord/buildRecordhigh.css',controller: 'BuildRecordCtrl'}).state(header+'buildDetail', {url: '/buildDetail/:recordId/:appId',templateUrl: 'business/components/buildRecord/buildDetail/buildDetail.html',cssUrl: 'business/components/buildRecord/buildDetail/buildDetail.css',controller: 'BuildDetailCtrl'}).state(header+'appUpload',{url: '/appBuild/upload',templateUrl: 'business/components/buildRecord/upload/upload.html',cssUrl: 'business/components/buildRecord/upload/upload.css',controller: 'AppUploadCtrl'}).state(header+'appDeploy',{url: '/appBuild/deploy',templateUrl: 'business/components/buildRecord/deploy/deploy.html',cssUrl: 'business/components/buildRecord/deploy/deploy.css',controller: 'deployCtrl' }).state(header+'compomentRecord',{url: '/compoment',templateUrl: 'business/components/componentRecord/componentRecord.html',cssUrl: 'business/components/componentRecord/componentRecord.css',controller: 'ComponentRecordCtrl' }).state(header+'componentUpload',{url: '/compoment/upload',templateUrl: 'business/components/componentRecord/upload/uploadhigh.html',cssUrl: 'business/components/componentRecord/upload/uploadhigh.css',controller: 'ComponentUploadCtrl' }).state(header+'myComponent',{url: '/myComponent?appId/:appName',templateUrl: 'business/components/myComponent/myComponent.html',cssUrl: 'business/components/myComponent/myComponent.css',controller: 'myComponentCtrl' })// .state(header+'myToggle',{ // url: '/myToggle/:tabIndex/:appName/:envType', // templateUrl: 'business/components/myToggle/myToggle.html', // cssUrl: 'business/components/myToggle/myToggle.css', // controller: 'myToggleCtrl' // }).state(header+'storeManager',{url: '/storeManager?storename/:storetype',templateUrl: 'business/components/storeManager/storeManager.html',cssUrl: 'business/components/storeManager/storeManager.css',controller: 'storeManagerCtrl'}).state(header+'addStore',{url: '/storeManager/addStore',templateUrl: 'business/components/storeManager/addStore/addStore.html',cssUrl: 'business/components/storeManager/addStore/addStore.css',controller: 'addStoreCtrl' }).state(header+'searchLogger',{url: '/storeManager/searchLogger',templateUrl: 'business/components/storeManager/searchLogger/searchLogger.html',cssUrl: 'business/components/storeManager/searchLogger/searchLogger.css',controller: 'searchLoggerCtrl' }).state(header+'cleanSetting',{url: '/storeManager/cleanSetting',templateUrl: 'business/components/storeManager/cleanSetting/cleanSetting.html',cssUrl: 'business/components/storeManager/cleanSetting/cleanSetting.css',controller: 'cleanSettingCtrl' }).state(header+'NoticeSetting',{url: '/storeManager/NoticeSetting',templateUrl: 'business/components/storeManager/NoticeSetting/NoticeSetting.html',cssUrl: 'business/components/storeManager/NoticeSetting/NoticeSetting.css',controller: 'NoticeSettingCtrl'}).state(header+'myToggle',{url: '/myToggle/:tabIndex/:appName/:envType/:type',templateUrl: 'business/components/myToggle/myToggle.html',cssUrl: 'business/components/myToggle/myToggle.css',controller: 'myToggleCtrl' }).state(header+'imageDetail', {url: '/imageDetail/:recordId',templateUrl: 'business/components/buildRecord/imageDetail/imageDetail.html',cssUrl: 'business/components/buildRecord/imageDetail/imageDetail.css',controller: 'BuildDetailCtrl'})}]);app.run(['$rootScope', 'LoginService', '$window', ($rootScope, LoginService, $window) => {document.domain = 'cnsuning.com'window.parent.ifr1Init && window.parent.ifr1Init($rootScope, $window, LoginService)$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, options) {toStateCache = toStatefromStateCache = fromState// let params = /\/(\d+)$/.exec(location.href)// let projectId = params && params[1]$rootScope.projectId = toParams.projectId})//be careful, the time of removing css file is important, or the screen view would be flashing$rootScope.$on('$viewContentLoaded', function (event, viewConfig) {if (!toStateCache || !fromStateCache) returnlet sameName = getSameStateName(toStateCache, fromStateCache)let exceptName = toStateCache.name || ''removeCssList(sameName, exceptName)for (let i = 0; i < cssToBeEnableList.length; i++) {cssToBeEnableList.pop()()}})}]) }function addResolve(obj) {obj.resolve = {css: ['$q', '$state', ($q, $state) => {var deferred = $q.defer();if (obj.cssUrl) {let csslink = document.createElement('link')csslink.setAttribute('rel', 'stylesheet')csslink.setAttribute('type', 'text/css')csslink.setAttribute('href', obj.cssUrl)csslink.setAttribute('data-name', obj.name)csslink.addEventListener('load', e => {let styleSheet = csslink.sheet || csslink.styleSheet;//如果可以在加載css文件的同時disabled,應該可以避免閃爍styleSheet.disabled = truecssToBeEnableList.push((sheet => {return function () {sheet.disabled = false}})(styleSheet))deferred.resolve()})document.head.appendChild(csslink)} else {deferred.resolve()}return deferred.promise;}]}return obj }function mockFn(obj, name) {let old = obj[name]obj[name] = function () {arguments[1].name = arguments[0]return old.call(obj, arguments[0], addResolve(arguments[1]))} }/*** */ function removeCssList(sameName, exceptFile) {if (!sameName.length) returnlet exceptArr = exceptFile.split('.'),exceptStr = '',exceptName = ''if (exceptFile.match('.')) {exceptArr.forEach(e => {exceptName += exceptName ? '.' + e : eexceptStr += ':not([data-name="' + exceptName + '"])'})}let links = document.querySelectorAll('head>link[data-name]' + exceptStr)for (let i = 0; i < links.length; i++) {let link = links[i]if (sameName.length === 0) {document.head.removeChild(link)} else {let name = ''let r = sameName.every(e => {name += name ? '.' + e : eif (name !== link.dataset.name) {return true}})if (r)document.head.removeChild(link)}} }/*** get the same part between toState.name and fromState.name*/ function getSameStateName(toState, fromState) {let toStateName = toState.name.split('.'),fromStateName = fromState.name.split('.'),result = []for (let i = 0; i < toStateName.length; i++) {if (toStateName[i] === fromStateName[i]) {result.push(toStateName[i])} elsebreak}return result }前端框架:
總結
以上是生活随笔為你收集整理的angularjs 路由---angularjs 搭建前端框架的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: nodejs error Windows
- 下一篇: 大彻大悟是什么歌的歌词 什么歌有大彻大悟