angular.js - angular + es6 + webpack遇到的問題？
問題描述
1、代碼如下：
//app.jsimport angular from 'angular';import uiRouter from 'angular-ui-router';import routing from './app.config';import HomeController from './controllers/home.controller';let app = angular.module(’app’, [uiRouter]);app.config(routing) .controller(’HomeController’, HomeController)
2、home.controller.js代碼如下：
class HomeController{ constructor($scope){console.info(’為什么這里運(yùn)行了兩次？’); }}HomeController.$inject = [’$scope’];export default HomeController;
3、app.config.js代碼如下：
routing.$inject = [’$stateProvider’, ’$urlRouterProvider’, ’$locationProvider’];export default function routing($stateProvider, $urlRouterProvider, $locationProvider){ $urlRouterProvider.otherwise(’/home’); $stateProvider.state(’home’, { url: ’/home’, templateUrl: require(’../views/home.html’), controller: ’HomeController’, title: ’社區(qū)綜合受理平臺(tái)’}).state(’record’, { url: ’/record’, templateUrl: ’views/record.html’, controller: ’RecordController’, title: ’社區(qū)服務(wù)綜合受理記錄’}).state(’guide’, { url: ’/guide’, templateUrl: ’views/guide.html’, title: ’社區(qū)受理服務(wù)事項(xiàng)’}).state(’proof’, { url: ’/proof’, templateUrl: ’views/proof.html’, controller: ’ProofController’, title: ’居住證明’}).state(’poor’, { url: ’/poor’, templateUrl: ’views/poor.html’, controller: ’PoorController’, title: ’就業(yè)困難人員待定’})};
4、html如下：
<!DOCTYPE html><html xmlns:ng='http://angularjs.org' lang='en' ng-app='app'><head> <meta charset='UTF-8'> <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'/> <title ng-bind='title'></title></head><body ng-controller='MainController' ui-view></body></html>
5、home.html:
<p id='root'> <p class='head clearfix'><ul class='title clearfix'> <li><h3 ng-bind='title'></h3> </li></ul> </p> <p class='content'><p ng-controller='HomeController'> 這個(gè)是模板！！！</p> </p></p>
6、問題：為什么constrcutor()運(yùn)行了2次？
問題解答
回答1：能看你的路由配置和html片段頁面嗎?一般情況是路由里配置了controller，在路由html片段里又聲明了ng-controller。
------ 分割線 -----很明顯嗎！你既在路由里配置了HomeController，又在home.html聲明了ng-controller='HomeController' 當(dāng)然會(huì)執(zhí)行兩遍啦！
相關(guān)文章：
1. nignx - docker內(nèi)nginx 80端口被占用2. javascript - 在移動(dòng)設(shè)備上快速滾動(dòng)屏幕然后點(diǎn)擊使?jié)L動(dòng)停止，如何盡量避免在點(diǎn)擊時(shí)誤觸<a>標(biāo)簽，跳轉(zhuǎn)到其他頁？3. html5 - 自己的H5頁面如何集成支付寶支付4. python - pandas html格式的excel文件5. javascript - 關(guān)于這組數(shù)據(jù)如何實(shí)現(xiàn) 按字母列表分類展示 不改動(dòng)數(shù)據(jù)結(jié)構(gòu)6. python2.7 - python 中文寫入文件后亂碼7. javascript - react native在run-android時(shí)出現(xiàn)這個(gè)錯(cuò)誤該怎么解決？大神賜教8. windows7 ping不通虛擬機(jī)VMware上的linux（ubuntu）的ip9. javascript - uc、qq、搜狗 以上三個(gè)手機(jī)瀏覽器判斷移動(dòng)端的js代碼不執(zhí)行10. python - 有什么好的可以收集貨幣基金的資源?
網(wǎng)公網(wǎng)安備