角指令不工作Chrome封裝應用

下面是這個的jsfiddle：http://jsfiddle.net/6XneN/18/角指令不工作Chrome封裝應用

這是我爲我的打包應用程序的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文件都非常好，所以我相信這不是問題。

來源

2013-05-27 Tyler Sanderson

在您的JSFiddle中，Angular會查找'test'模塊，但無法找到它，因爲您的模塊定義位於angular lib解析DOM後執行的onLoad事件處理程序中。如果您檢查您的控制檯，你會看到一個

Uncaught Error: No module: test.

在Chrome打包應用程序，我就創建了一個簡單的應用程序和運行段和它的作品與角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, 
    }; 
})

這裏是產生應用程序： enter image description here

來源

2013-05-27 19:42:38 mangini

謝謝你非常詳細的解答！ –

角指令不工作Chrome封裝應用

回答

相關問題