Angularjs - zmienić widok na podstawie przeglądarki/platformy?

Question

Czy istnieją wbudowane usługi/dyrektywy/trasy do zmiany widoku (lub strony za pomocą routingu) na podstawie typu przeglądarki/platformy, z której użytkownik korzysta? Chciałbym, aby telefony i tablety miały inny widok niż użytkownicy komputerów.

Answer 1

Nie znam niczego wbudowanego w Angular, ale można to zrobić, wprowadzając logikę do reguł routingu. Na przykład:

angular.module('browser-routing', []). 
    config(function($routeProvider) { 
    $routeProvider. 
     when('/', {templateUrl: getBrowser() + '.html'}) 
}); 

W tym przykładzie, jeśli getBrowser() zwraca 'iphone' będzie renderowanie widoku iphone.html

można użyć BrowserDetect robić to, co sama nazwa wskazuje.

fiddle example for Chrome and Firefox detection

Answer 2

Chociaż angularjs nie posiada żadnej szczególnej funkcji, aby to zrobić out-of-the-box, istnieje wiele różnych podejść do osiągnięcia czegoś takiego:

1. Korzystanie CSS3 media queries to make a responsive design. W zależności od potrzeb może to być najlepszym rozwiązaniem, ponieważ można uniknąć ponownego wdrażania funkcji dla wielu rzutni.

2. Można napisać usługę sprawdzić i dokonać zmiany trasy:

   myApp.factory('checkWidth', function ($location, $window) { 
       return function() { 
       if ($window.document.width < 700) { 
        $location.url('/mobile'); 
       } 
       } 
   });