带有 css 文件的 LazyLoading AngularJs 模块在 Awesomium 网络视图中失败
LazyLoading AngularJs module with css file fails with Awesomium web view
我尝试使用 ocLazyLoad 延迟加载 AngularJs 模块。在我添加 css 文件之前一切正常,然后 AngularJs 应用程序不起作用。这里的代码适用于任何浏览器和 CEF 但不适用于 Awesomium:
(您可以使用 Awesomium 选项卡式浏览器示例轻松进行测试)
index.html:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-1.11.2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.7/angular.js"></script>
<script src="ocLazyLoad.js"></script>
</head>
<body>
<div id="example" ng-app="LazyLoadTest" ng-controller="TestController">
</div>
<script>
angular.module("LazyLoadTest", [ "oc.lazyLoad"])
.controller("TestController", function($scope, $ocLazyLoad, $compile){
$ocLazyLoad.load({
name: "testApp",
files: ["testApp.js", "testApp.css"],
serie: true
}).then(function () {
var el, elToAppend;
elToAppend = $compile('<say-hello to="world"></say-hello>')( $scope );
el = angular.element('#example');
el.append(elToAppend);
}, function (e) {
console.log(e);
})
});
</script>
</body>
</html>
testApp.js:
(function () {
'use strict';
angular.module("testApp", []).directive("sayHello", function () {
return {
scope: {
to: '@to'
},
restrict: "E",
template: '<p>Hello {{to}}</>'
};
});
})();
testApp.css:
body{color: red;}
这是Awesomium 还是ocLazyLoad 的问题?有解决方法吗?
编辑:
非常有趣的是,如果您使用 WPF 示例进行测试,CSS 根本没有应用,在 WinForms 示例中它是。但是对于这两个 AngularJs 指令都不起作用。
问题最严重的是 awesomium。它使用的是 chromium 版本 18,当前版本是 40。我也遇到了同样的问题。我试过 CEF,但 cef 的问题是我的性能很差。接下来我尝试使用 GeckoFx,但是我尝试过的来自 bitbucket 的任何版本都没有编译...
我尝试使用 ocLazyLoad 延迟加载 AngularJs 模块。在我添加 css 文件之前一切正常,然后 AngularJs 应用程序不起作用。这里的代码适用于任何浏览器和 CEF 但不适用于 Awesomium:
(您可以使用 Awesomium 选项卡式浏览器示例轻松进行测试)
index.html:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-1.11.2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.7/angular.js"></script>
<script src="ocLazyLoad.js"></script>
</head>
<body>
<div id="example" ng-app="LazyLoadTest" ng-controller="TestController">
</div>
<script>
angular.module("LazyLoadTest", [ "oc.lazyLoad"])
.controller("TestController", function($scope, $ocLazyLoad, $compile){
$ocLazyLoad.load({
name: "testApp",
files: ["testApp.js", "testApp.css"],
serie: true
}).then(function () {
var el, elToAppend;
elToAppend = $compile('<say-hello to="world"></say-hello>')( $scope );
el = angular.element('#example');
el.append(elToAppend);
}, function (e) {
console.log(e);
})
});
</script>
</body>
</html>
testApp.js:
(function () {
'use strict';
angular.module("testApp", []).directive("sayHello", function () {
return {
scope: {
to: '@to'
},
restrict: "E",
template: '<p>Hello {{to}}</>'
};
});
})();
testApp.css:
body{color: red;}
这是Awesomium 还是ocLazyLoad 的问题?有解决方法吗?
编辑:
非常有趣的是,如果您使用 WPF 示例进行测试,CSS 根本没有应用,在 WinForms 示例中它是。但是对于这两个 AngularJs 指令都不起作用。
问题最严重的是 awesomium。它使用的是 chromium 版本 18,当前版本是 40。我也遇到了同样的问题。我试过 CEF,但 cef 的问题是我的性能很差。接下来我尝试使用 GeckoFx,但是我尝试过的来自 bitbucket 的任何版本都没有编译...