Angular.js ไม่ทำงานแท็ก ng-view ใน PhoneGap

ฉันพยายามใช้ Angular.js กับ PhoneGap มันทำงานได้ดีบนเบราว์เซอร์ Chrome แต่มันใช้งานไม่ได้
ที่แท็ก ng-view และโมดูลเชิงมุมจะไม่ถูกเรียกเมื่อฉันรันบนเครื่องจำลอง คุณมีความคิดบ้างไหม?

รหัสของฉันเป็นแบบนี้

ดัชนี.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>

ดัชนี 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('');
    }
};

เราเตอร์.js

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

cordova javascript angularjs
person nobinobiru    schedule 15.09.2012    source แหล่งที่มา

คำตอบ (3)


arrow_upward
11
arrow_downward

ลองใช้วิธี bootstrap api เพื่อเริ่มแอปบนอุปกรณ์Ready ด้วยตนเอง สิ่งที่ต้องการ:

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

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

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

person Dve    schedule 30.09.2012
comment
ปัญหาเดียวกัน เพิ่มบรรทัดด้วย แต่ยังคง Ripple - เบราว์เซอร์ Nexus ค้างอยู่ ไม่มีอะไรมา ฉันต้องทำอะไรอีกไหม? - person Keval Patel; 13.03.2016

arrow_upward
0
arrow_downward

ลองดาวน์โหลดไฟล์ angularjs และ zepto จากเซิร์ฟเวอร์นี้แล้ววางไว้ภายในแอป

person mccraveiro    schedule 28.09.2012

arrow_upward
0
arrow_downward

ฉันใช้เวลาประมาณ 5 ชั่วโมงในการพยายามแก้ไขปัญหาที่คล้ายกัน ปรากฎว่า phone-gap / cca มีเหตุผลบางอย่างที่ทำให้ app-id นำหน้าส่วนแฮชของ URL เส้นทางจึงไม่ตรงกันและผู้ใช้ถูกส่งต่อกลับอย่างต่อเนื่องด้วยการโทร $routeProvider.otherwise()

(ตั้งแต่นั้นมาฉันพบว่ามันเป็นปัญหาที่ทราบของ CCA ซึ่ง แม้จะได้รับการแก้ไข เพียงแต่ยังไม่เผยแพร่!)

อย่างไรก็ตาม ในระหว่างนี้ หากคุณประสบปัญหาในการทำให้ ngRoute ทำงานร่วมกับ mobile-chrome-tools และ Phonegap ให้ลองเพิ่มกลุ่มการจับคู่ที่เป็นตัวเลือกสองกลุ่มในเส้นทางของคุณเพื่อแก้ไข ตัวอย่างเช่น ยกตัวอย่างนี้:

$routeProvider.when('/', { templateUrl: 'templates/home.html', controller: 'HomeCtrl' });
$routeProvider.when('/some-page', { templateUrl: 'templates/some-page.html', controller: 'SomePageCtrl' });
$routeProvider.when('/another-page', { templateUrl: 'templates/another-page.html', controller: 'AnotherPageCtrl' });
$routeProvider.otherwise({ redirectTo: '/' });

เส้นทางจะไม่ตรงกับบิตพิเศษที่เพิ่มเข้าไปใน URL แต่คุณสามารถแก้ไขได้ดังนี้:

$routeProvider.when('/:a?/:b?/some-page', { templateUrl: 'templates/some-page.html', controller: 'SomePageCtrl' });
$routeProvider.when('/:a?/:b?/another-page', { templateUrl: 'templates/another-page.html', controller: 'AnotherPageCtrl' });
$routeProvider.when('/:a?/:b?/', { templateUrl: 'templates/home.html', controller: 'HomeCtrl' });
$routeProvider.otherwise({ redirectTo: '/' });

สังเกตกลุ่มตัวเลือกสองกลุ่มที่ฉันเพิ่มไว้ โปรดทราบว่าเส้นทางหลักจะมาทีหลัง - มิฉะนั้นจะจับคู่เส้นทางทั้งหมด/ส่วนใหญ่หากสร้าง URL อย่างถูกต้อง!

person kzar    schedule 27.03.2014