角指令不起作用Chrome打包的應用

Question

這是這個jsfiddle： http : //jsfiddle.net/6XneN/18/

這是打包應用程序的HTML：

<!DOCTYPE html>
    <html ng-app ng-csp>
        <head>
        </head>
        <title>Chrome Learning App</title>
        <body>
            <div ng-app='test'>
                <hello>Test</hello>
            </div>
            <script src="angular.min.js"></script>
            <script src="files.js"></script>
        </body>
     </html>

另外，這是Javascript：

angular.module('test', []).directive('hello', function() {
    return {
        restrict : 'E',
        template : '<div>WHY ISNT THIS WORKING</div>',
        replace: true,
    };
});

當在JSFiddle上將代碼自動換行設置為“ No Wrap-in”時，該指令可以正常工作。 但是，當在JSFiddle上選擇onload時，它不起作用。 我認為這就是該指令不適用於Chrome Packaged Apps的原因。 我沒有任何錯誤，只是沒有顯示更改。 關於如何解決此問題有任何想法嗎？

PS：我的manifest和background.js文件都很好，所以我確定這不是問題。

Answer 1

在您的JSFiddle中，Angular尋找一個“測試”模塊，但找不到它，因為您的模塊定義位於onLoad事件處理程序中，該處理程序在angular lib解析DOM后執行。 如果您檢查控制台，應該會看到一個

未捕獲的錯誤：無模塊：測試。

在一個Chrome打包的應用程序中，我剛剛創建了一個簡單的應用程序並運行您的代碼段，它可以與Angular 1.0.7一起正常工作：

manifest.json的：

{
  "manifest_version": 2,
  "name": "Test angular",
  "version": "1",
  "app": {
    "background": {
      "scripts": ["main.js"]
    }
  }
}

main.js：

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('index.html',
    {width: 500, height: 300});
});

index.html的：

<!doctype html>
<html>
  <head>
    <script src="angular.js"></script>
    <script src="controller.js"></script>
  </head>
  <body>
    <div ng-app="test">
      <hello>Test</hello>
    </div>
  </body>
</html>

最后是controller.js：

var test = angular.module('test',[]);

test.directive('hello', function() {
  return {
    restrict : 'E',
        template : '<div>WHY ISNT THIS WORKING</div>',
        replace: true,
  };
})

這是生成的應用程序： 在此處輸入圖片說明

角指令不起作用Chrome打包的應用

問題描述

1 個解決方案

解決方案1
2 已采納 2013-05-27 19:42:38

角指令不起作用Chrome打包的應用

問題描述

1 個解決方案

解決方案1 2 已采納 2013-05-27 19:42:38

解決方案1
2 已采納 2013-05-27 19:42:38