2012-07-31 3 views
5

Si è verificato uno strano problema durante l'utilizzo del modello angularjs in un'estensione di Chrome basata sullo script di contenuto. Vado in un ciclo infinito. Quando uso un modello in linea (usando l'attributo template con una stringa), funziona perfettamente. Qualcuno può suggerire cosa sto facendo male?angularjs nell'estensione del cromo

manifest.json

{ 
    "name": "Content Script Cross-Domain XMLHttpRequest Example", 
    "version": "2.0.0", 
    "manifest_version": 2, 
    "description": "Demonstrates making cross domain requests from a content script by putting Twitter trends on Google News.", 
    "permissions": [ 
    "http://localhost:9393/*" 
    ], 
    "icons": { 
    "48" : "sample-48.png", 
    "128" : "sample-128.png" 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["http://news.google.com/*","*://mail.google.com/*"], 
     "js" : ["lib/jquery-1.6.4.min.js","lib/angular-1.0.1.min.js", "app.js","contentscript.js"] 
    } 
    ] 
} 

app.js

angular.module('myApp', []). 
    config(['$routeProvider', function($routeProvider) { 
    console.log('inside angular.module'); 
    $routeProvider. 
     when('/', {templateUrl: 'contact.html', controller: AppController}). 
     otherwise({redirectTo: '/'}); 
}]); 


function AppController($scope){ 
    console.log('inside AppController'); 
} 

all'interno contentscript.js

$(this).append('<div id="gmeAppContainer">' 
           + '<div ng-view></div>' 
           + '</div>'); 
var rootEle = $(this).find('#gmeAppContainer'); 
angular.bootstrap(rootEle,['myApp']); 

Quando uso Tempate inline in app.js, funziona benissimo.

when('/', {template: '<div>This is inline template </div>', controller: AppController}). 

hanno pubblicato su angularjs gruppo google https://groups.google.com/d/topic/angular/A_SVYZWPKe8/discussion

risposta

4

Sembra che ho capito.

Prima dichiarare il file modello nel file manifest.json.

"web_accessible_resources" :[ 
     "contact.html" 
    ] 

quindi utilizzare il metodo chrome.extension.getURL per ottenere l'url assoluto del file template

when('/', { controller: AppController, templateUrl : chrome.extension.getURL('contact.html')}). 
+0

da app.js non chrome.extension.getURL lavoro – apueee

+0

ho ricevuto il messaggio di errore angolare l'URL non è affidabile, quindi ho aggiunto $ sce.trustAsResourceUrl: '' ' $ sce.trustAsResourceUrl (chrome.extension.getURL ('html/drive-properties.html')) ' '' – Paul