angular.js在PhoneGap中不起作用ng-view标签

Question

angular.js在PhoneGap中不起作用ng-view标签

nob*_*iru 8 javascript angularjs cordova

我尝试将angular.js与PhoneGap一起使用.它在chrome浏览器上工作正常.但它不适
用于ng-view标签.当我在模拟器上运行时,角度模块不会调用.你有什么主意吗？

我的代码是这样的.

的index.html

   <body>
        <div class="app" >
            <h1>Welcome!</h1>
            <div id="deviceready">
                            <div ng-view></div>
            </div>
        </div>

        <script type="text/javascript" src="cordova-2.0.0.js"></script>
        <script type="text/javascript" src="js/index.js"></script>


        <script type="text/javascript">
            app.initialize();
        </script>
                <script src="http:////cdnjs.cloudflare.com/ajax/libs/zepto/1.0rc1/zepto.min.js"></script>
                <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"> </script>
                <script type="text/javascript" src="js/router.js"></script>

    </body>

Run Code Online (Sandbox Code Playgroud)

index.js

var app = {
    initialize: function() {
        this.bind();
    },
    bind: function() {
        document.addEventListener('deviceready', this.deviceready, false);
    },
    deviceready: function() {
        // note that this is an event handler so the scope is that of the event
        // so we need to call app.report(), and not this.report()
        app.report('deviceready');
    },
    report: function(id) { 
        console.log("report:" + id);
        // hide the .pending <p> and show the .complete <p>
        document.querySelector('#' + id + ' .pending').className += ' hide';
        var completeElem = document.querySelector('#' + id + ' .complete');
        completeElem.className = completeElem.className.split('hide').join('');
    }
};

Run Code Online (Sandbox Code Playgroud)

router.js

angular.module("app",[]).
    config(["$routeProvider",function($routeProvider){
        $routeProvider.when("/",{templateUrl:"templates/home.html"});
    }]);

Run Code Online (Sandbox Code Playgroud)

Answer 1

Dve*_*Dve 11

尝试使用bootstrap api方法在deviceReady上手动启动应用程序.就像是:

function onDeviceReady() {
    ...
    angular.bootstrap(document, ['ngView']);
    ...
}

document.addEventListener("deviceready", onDeviceReady, true);

Run Code Online (Sandbox Code Playgroud)

http://docs.angularjs.org/api/angular.bootstrap

归档时间：	13 年，3 月前
查看次数：	5344 次
最近记录：	11 年，8 月前