AngularJs 使用 ui-router , 子页面里面的 js 不执行什么鬼？

父页面为

```html
<body ng-app="test">


<div ui-view=""></div>
</body>
```

子页面为：

```html
<h1>Hello world</h1>
<script>
alert("Hello world");
</script>
```

使用 ui-router 进行加载

```js

$stateProvider
.state('test', {
url:"/test",
templateUrl:"pages/test.html"
})
```

页面加载进来了，但是哪个 alert 没有执行，怎么让他执行啊？

haogre

2015-11-27 15:37:29 +08:00

sneezry

2015-11-27 15:42:11 +08:00

所以 C 和 V 你还是没有分开…

hahastudio

2015-11-27 15:52:08 +08:00

http://stackoverflow.com/questions/21336350/angularjs-inline-script-in-the-included-html-template
You need jQuery (load it before Angular)

zythum

2015-11-27 15:56:01 +08:00

估计 AngularJs 是直接 innerHTML 进来的。（不过不 innerHTML 进来还能怎么进来呢）。那么里面的 script 标签是不会执行的。

对此需要扫描插入区域的 script 标签。区内容 eval()一下（这里需要考虑下字面量 eval 还是全局函数 eval 的对于 this 的区别。如果不知道用后面的方法）。或者把这个标签 remove 掉再在 body 里面插入一次。

你看 query 的 html()是可以执行 script 标签的吧。因为人家帮你做了上面的事情。(不过这个 jquery 在 2.0 的时候移除了这歌处理。 1.x 版本是有的。见 manipulation.js 文件)

wensonsmith

2015-11-27 16:07:10 +08:00

@haogre 我放在 JS 里面，然后在子页面中添加 <script src="test.js"> , 这样 state 加载进来以后，还是没用，网络请求都没有请求这个 js

wensonsmith

2015-11-27 16:08:09 +08:00

@sneezry 这个 state 页面需要一个 jquery 生成二维码的 js, 不知道怎么分开啊

wensonsmith

2015-11-27 16:10:56 +08:00

@zythum 在哪里去执行这个 eval() 啊？ ui-router 直接就给怼进去了啊， ui-router 子页面的 js 文件都没法加载：（

wensonsmith

2015-11-27 16:12:54 +08:00

@hahastudio 多谢，不知到 google 怎么搜关键词啊

dong3580

2015-11-27 16:13:54 +08:00

@wensonsmith
1.你这样就得把渲染的标注为非安全的 html ，不推荐这么搞，
2.js 加参数生成二维码呀,
3.或者，后端生成，加链接弹窗，用户点的时候请求后端，返回图片链接。
@sneezry 说得对，你还是没问题，搅在了一起以后你自己都不好维护了。

zythum

2015-11-27 16:14:08 +08:00

给你个馊主意

把你的 script 改成下面的。

<img src="about:blank"
onerror="document.body.appendChild(document.createElement('script')).src='test.js'"/>

xss 专用语句....

23333333

sneezry

2015-11-27 16:16:21 +08:00

@wensonsmith 具体情况我不太清楚，我说一下我自己的直观感觉，具体实现可能还需要你自己考虑一下。 jQuery 的二维码生成库直接在 index.html 引用，然后在 state 这个 view 里绑定一个 controller ，在这个 controller 里封装生成二维码的方法，最后把生成二维码相关的数据写在 dom 的 attribute 里，我觉得这样就可以了。

hahastudio

2015-11-27 16:16:40 +08:00

@wensonsmith Embed javascript in angular

klesh

2015-11-27 16:19:54 +08:00

1. 在 index.html 里面引用生成二维码的 js 类库文件。
2. 给你的 state 加个 controller
3. 在你的 template 里面，加个放置二维码结果的标签如：<div id="qrcode"></div>
4. 在 controller 里面，利用 $timeout ，延时一定时间，如 100ms ，再执行生成二维码的生成操作。如
controller('TestCtrl', function($scope, $timeout) {
$timeout(function(){
$scope.qrcode = $scope.qrcode || new QRCode('#qrcode'); // 假定是这样初始化
$scope.qrcode.render('hello world');
}, 100)
})

klesh

2015-11-27 16:20:24 +08:00

```js
var test = 'code block';
```

dong3580

2015-11-27 16:21:15 +08:00

@zythum
不必要这样，直接 img 引用图片链接，用户需要的时候点击一下 display:block 不就出来了
我这边是每次打开页面后端调用 zxing 的生成二维码，到缓存链接

@wensonsmith
你就把 angularjs 当成 js 一个插件，类似 jquery 一样，两者都是可以互相一起混用的，都是 js ，大胆写吧，

JenJieJu

2015-11-27 16:21:23 +08:00

执行写在 ctrl 里啊。。。。

wensonsmith

2015-11-27 16:24:06 +08:00

@dong3580 还是分开的好，琢磨下怎么搞。多谢啊！

wensonsmith

2015-11-27 16:24:28 +08:00

@zythum 。。。这个法子也是醉了！

wensonsmith

2015-11-27 16:24:55 +08:00

@sneezry 恩，我现在的思路也差不多是这样，搞搞试一试

wensonsmith

2015-11-27 16:25:34 +08:00

@hahastudio Nice ！！！我一直搜什么 ui-route js not work 。。。。啥都找不到，英语渣

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/239426

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.