晚上在看angular时候,遇到了一个问题
问题描述:
index.html
<!DOCTYPE html> <html ng-app='a'> <head></head> <body ng-controller='first'> <div>hello</div> <div ng-include=b.html></div> <script type="text/JavaScript" src='https://code.angularjs.org/1.5.10/angular.min.js'></script> <script type="text/JavaScript" src="/public/javascripts/news_app.js"></script> </body> </html>
b.html
<!DOCTYPE html> <html ng-app='a'> <head></head> <body ng-controller='first'> <div>hahaha</div> <script style='text/javascript' src='c.js'></script> <script type="text/JavaScript" src='https://code.angularjs.org/1.5.10/angular.min.js'></script> <script type="text/JavaScript" src="/public/javascripts/news_app.js"></script> </body> </html>
news_app.js
var NewsPub=angular.module('a',[]); NewsPub.controller('first',['$scope','$http','$window',function($scope,$http,$window){ });
你会发现,c.js根本没有被调用!!!!!
我以为自己哪里因为粗心写错了变量,然后找了好半天自己变量问题,郁闷。。。。
后来我就各种百度,哈哈哈,原来这是angular的某种机制,最终发现有个人在stack上找到了解决方法,现在归纳使用如下:
在news_app.js加入如下代码
news_app.js
问题解决~~~~~~~~~(function (ng) { 'use strict'; var app = ng.module('ngLoadScript', []); app.directive('script', function() { return { restrict: 'E', scope: false, link: function(scope, elem, attr) { if (attr.type==='text/javascript-lazy') { var s = document.createElement("script"); s.type = "text/javascript"; var src = elem.attr('src'); if(src!==undefined) { s.src = src; } else { var code = elem.text(); s.text = code; } document.head.appendChild(s); elem.remove(); } } }; }); }(angular)); var NewsPub=angular.module('a',[' ngLoadScript ']);NewsPub.controller('first',['$scope','$http','$window',function($scope,$http,$window){ });