为什么 ng-scope 被添加到我的部分视图的 javascript 内联并且使警报不起作用? [英] Why ng-scope is added to javascript inline of my partial view and makes alert not working?

问题描述

我将 AngularJs 与模板系统一起使用.我想向每个模板添加特定的内联 javascript 脚本，添加与所选选项卡有关的警报框(主页 | 列表 | 设置)

I'm using AngularJs with templating system. I want to add specific inline javascript script to each template adding alert box regards to the selected tab ( Home | List | Settings )

HTML 渲染:但是添加了 ng-scope 并且在您更改选项卡时没有任何警报.

Html renders : but ng-scope is added and nothing alerts when you change of tabs.

<script type="text/javascript" class="ng-scope">alert("home")</script>

我在此处提供示例:

http://bit.ly/HWcN1H

或者这里

plunkr 示例，带有 alert("template1") 出现在 template1.html 中但呈现作为

plunkr example with alert("template1") present into template1.html but renders as

<script type="text/javascript" class="ng-scope">alert("template1")</script>

推荐答案

我在 github

同样的过程.

1. 创建 angular-loadscript.js(来自上面的链接)

2. 在您的应用中使用ngLoadScript"作为资源依赖项.

1. Create the angular-loadscript.js (from the link above)

2. in your app use 'ngLoadScript' as a resource dependency.

var app = angular.module('YOUR_APP_NAME', ['ngResource','ngRoute', ...,'ngLoadScript']);

var app = angular.module('YOUR_APP_NAME', ['ngResource','ngRoute', ...,'ngLoadScript']);

在您的部分使用 'text/javascript-lazy' 作为 MIME 类型.

In your partial use 'text/javascript-lazy' as the MIME type.

一切都应该按要求工作:

Everything should work as required:

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

}(angular));

这篇关于为什么 ng-scope 被添加到我的部分视图的 javascript 内联并且使警报不起作用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！