首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >Angularjs不会在ng-view中加载脚本

Angularjs不会在ng-view中加载脚本
EN

Stack Overflow用户
提问于 2013-08-14 06:20:16
回答 2查看 28.9K关注 0票数 46

我有一些特定于视图的脚本。然而,当angularjs加载视图时,脚本似乎不会执行。

Index.html

代码语言:javascript
复制
<html>
  <body ng-app="adminApp">

    <div ng-view=""></div>

    <script src="bower_components/angular/angular.js"></script>
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>

</body>
</html>

Main.html -在ng-view下加载

代码语言:javascript
复制
hello world
  <script>

    alert('Hello, John!')

  </script>

在这个例子中,当页面加载时,我看到一个基本的hello world打印在网站上。但是,我没有看到任何弹出窗口说“你好,John”。

知道为什么我不能加载特定于某个视图的脚本吗?

Extra info app.js (额外信息)

代码语言:javascript
复制
'use strict';

angular.module('adminApp', [])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  });

controllers/main.js

代码语言:javascript
复制
'use strict';

angular.module('adminApp')
  .controller('MainCtrl', function ($scope) {
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  });
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-08-14 06:37:15

这就是jqLite的工作方式。如果希望评估模板中的脚本,请在AngularJS之前包含jQuery。如果包含jQuery,则将对脚本进行评估。尝试删除jQuery,您会看到最初观察到的行为。

更新了:由于一些人在评论中要求详细说明,这里是:

当路由匹配时,ngView使用jqLite的html()方法(如果已加载,则使用jQuery的)来设置元素的内容(声明为ngView的那个元素)。换句话说,ngView.link()做这样的事情:

代码语言:javascript
复制
$element.html(template)

因此,这可以归结为如何在jqLite和jQuery中实现html()。jqLite使用原生innerHTML属性,该属性只设置内容,而不计算脚本。另一方面,jQuery解析出所有脚本标记并执行它们(通过构造脚本DOM元素并将其附加到页面)。

票数 64
EN

Stack Overflow用户

发布于 2017-03-17 06:16:35

如果我包含了需要处理视图的脚本,如何在视图加载后触发它?我不想包含jquery和/或碎片化我的脚本。

要在不加载jQuery的情况下执行<script>标记,请使用jqLite查找<script>标记,然后eval innerHTML

代码语言:javascript
复制
app.controller("vm", function($scope, $element) {

  //FIND script and eval 
  var js = $element.find("script")[0].innerHTML;
  eval(js);

});

The DEMO on PLNKR

另请参阅AngularJS Issue #369 — jqLite should create elements in same way as jQuery

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/18220197

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档