AngularJS:如何在 ng-include 中制作角度加载脚本? [英] AngularJS: How to make angular load script inside ng-include?

查看:22
本文介绍了AngularJS:如何在 ng-include 中制作角度加载脚本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

嘿,我正在构建一个有角度的网页.问题是已经构建了一些没有角度的东西,我也必须包括它们

Hey I am building a web page with angular. The problem is that there are somethings already build without angular and I have to include them as well

问题是这样的.

我的 main.html 中有这样的内容:

I have something like this in my main.html:

<ngInclude src="partial.html">
</ngInclude>

我的 partial.html 有这样的东西

And my partial.html has something like this

<h2> heading 1 <h2>
<script type="text/javascript" src="static/js/partial.js">
</script>

而我的 partial.js 与 angularjs 无关.nginclude 工作,我可以看到 html,但我根本看不到正在加载的 javascript 文件.我知道如何使用 firebug/chrome-dev-tool,但我什至看不到正在发出的网络请求.我做错了什么?

And my partial.js has nothing to do with angularjs. nginclude works and I can see the html, but I can not see the javascript file being loaded at all. I know how to use firebug/ chrome-dev-tool, but I can not even see the network request being made. What am I doing wrong?

我知道 angular 对脚本标签有一些特殊的意义.我可以覆盖它吗?

I knwo angular has some special meaning to script tag. Can I override it?

推荐答案

从 1.2.0-rc1+ (Github 问题).

The accepted answer won't work from 1.2.0-rc1+ (Github issue).

这是由 endorama 创建的快速修复:

Here's a quick fix created by endorama:

/*global angular */
(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 code = elem.text();
          var f = new Function(code);
          f();
        }
      }
    };
  });

}(angular));

只需添加此文件,将 ngLoadScript 模块加载为应用程序依赖项,并使用 type="text/javascript-lazy" 作为脚本的类型,您可以在部分中延迟加载:

Simply add this file, load ngLoadScript module as application dependency and use type="text/javascript-lazy" as type for script you which to load lazily in partials:

<script type="text/javascript-lazy">
  console.log("It works!");
</script>

这篇关于AngularJS:如何在 ng-include 中制作角度加载脚本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆