2013-08-12 18 views
6

Tôi đã đập đầu vào tường cố gắng tìm ra lý do tại sao định tuyến angularJS sẽ không hoạt động trong điện thoại cho tôi. Tôi có tất cả các tập tin thiết lập một cách chính xác và tôi không nhận được bất kỳ lỗi nào. Tôi đang cố gắng thay đổi url bằng cách sử dụng dịch vụ $ location.url trực tiếp từ góc cạnh. Vì vậy, khi bạn gõ vào một div bộ điều khiển sẽ có $ location.url ("hồ sơ") ví dụ và không có gì sẽ xảy ra. Tôi đã thử các giải pháp tìm thấy trong này stackoverflow nhưng điều đó không làm việc cho tôi. Tôi đang làm điều gì sai, hay có cách nào tốt hơn để tiếp cận điều này? Sau đây là định tuyến tôi đã thiết lậpĐịnh tuyến AngularJS không hoạt động bình thường trong PhoneGap

var app = angular.module("App", ["hmTouchevents"]) 
.config(function($routeProvider) { 

$routeProvider 
    .when("/index.html", { 
     templateUrl: "/views/login.html", 
     controller: "loginCtlr" 
    }) 
    .when("/landing", { 
     templateUrl: "/views/landing.html", 
     controller: "landingCtlr" 
    }) 
    .when("/single-view/:id", { 
     templateUrl: "/views/single-view.html", 
     controller: "singleViewCtlr" 
    }) 
    .when("/restaurant", { 
     templateUrl: "/views/restaurant-info.html", 
     controller: "restaurantCtlr" 
    }) 
    .when("/profile/:id", { 
     templateUrl: "/views/profile.html", 
     controller: "profileCtlr" 
    }) 
    .when("/lists/:list", { 
     templateUrl: "/views/lists.html", 
     controller: "listsCtlr" 
    }) 
    .when("/follow/:type", { 
     templateUrl: "/views/follow.html", 
     controller: "followCtlr" 
    }); 

}); 

Một bộ điều khiển mẫu sẽ là:

app.controller("listsCtlr", ["$scope", "$location", function($scope, $location){ 

$scope.goTo("profile"); 

}]); 

Như mọi khi bất kỳ giúp đỡ được nhiều đánh giá cao.

+0

Bạn đã thử ví dụ: '$ location.url (" #/profile ")'? –

+0

tôi có và vẫn không có súc sắc. Url dường như đang thay đổi tốt, nhưng góc cạnh dường như không lấy mẫu và đặt nó trong ngview. – selanac82

+0

bạn đã thử sử dụng html5mode chưa? –

Trả lời

0

trong điều khiển thử của bạn ...

$location.path('/profile'); 
4

Tôi đã có một vấn đề tương tự như đêm nay này. Vấn đề cốt lõi ở đây là PhoneGap không có máy chủ web tích hợp. Nếu bạn đang phát triển cục bộ, có thể bạn đang sử dụng máy chủ web, vì vậy bạn có thể thực hiện như sau: http://localhost/#/profile và định tuyến sẽ hoạt động. Tuy nhiên, PhoneGap tải mã của bạn bằng URL file://, chứ không phải http://. Nếu bạn thực hiện $location.url("profile"), bạn đang thay thế toàn bộ URL chỉ bằng file://profile, không tồn tại. Điều tương tự nếu bạn sử dụng liên kết như thế này: <a href="/#/profile">My Profile</a>

Giải pháp bằng cách nào đó giúp liên kết của bạn trỏ đến đúng địa điểm. Nếu bạn đang sử dụng $location.url() bạn có thể thêm tiền tố nó với đường dẫn tập tin của bạn: $location.url(window.location + "#/profile")

Nếu bạn chỉ cần thực hiện một liên kết, bạn sẽ có thể nhận được ngay với cất cánh dấu gạch chéo dẫn đến làm cho nó một URL có liên quan: <a href="/#/profile">My Profile</a> trở thành <a href="#/profile">My Profile</a>

0

Sau nhiều tinkering, đây là những gì phù hợp với tôi!

Nếu bạn có thể sử dụng $ location.path() trong bộ điều khiển, nó sẽ hoạt động như mong đợi, nhưng nếu bạn cần sử dụng liên kết kiểu href, bạn có thể tạo liên kết từ trang "cơ sở" góc (ví dụ: .html):

<a href="main.html#/profile">Link To Profile</a>

4

đã vấn đề chính xác cùng ... tôi đã có thể khắc phục điều này một cách dễ dàng bằng cách thêm đoạn mã sau vào phần đầu của tập tin index.html của tôi.

<base href="/android_asset/www/" /> 

Hy vọng điều này sẽ hữu ích.

+0

Điều này cũng phù hợp với tôi, liệu công việc này (như tôi có cần sửa lỗi tương tự cho iOS) hoạt động trên iOS không? Không có mac, thật khó để kiểm tra điều này vào lúc này. – KungWaz

+0

@KungWaz Tôi chưa thử tính năng này trên iOS. Tôi tin rằng cơ sở không phải là '/ android_asset /' trong iOS, vì vậy tôi sẽ kiểm tra nhật ký để xem trang được tải từ đâu và sau đó chỉ chuyển thẻ cơ sở sang thư mục 'www'. – gcr15

+2

đây không phải là giải pháp thích hợp vì giải pháp này chỉ hoạt động với các thiết bị Android ... –