Modifier l'affichage en fonction de la taille de l'écran

Je suis au courant d'une question similaire posée avant:

Modifier la templateUrl de la directive basée sur la résolution de l'écran AngularJS

Ce fut d'abord demandé plus d'un an et, depuis lors, AngularJS ai un peu changé. Je suis curieux de savoir si il y a d'autres façons de réaliser quelque chose de similaire que je n'ai pas trouvé beaucoup d'informations sur templateUrl échange, donc peut-être que je suis aboiements le mauvais arbre ici.

J'ai une single page application, sans routes.

html:

<body ng-app="App">
  //lots of html same for both desktop/mobile
  <my-dir></my-dir>
  //even more here
</body>

modèle 1:

<p>Mobile</p>

modèle 2:

<p>Desktop</p>

Je tiens à rendre modèle 1 lorsque l'écran passe en dessous de 700 pixels et modèle 2 autrement. Les modèles de changement de ce qui est à l'intérieur de mon-dir de la directive. Par exemple Modèle 1 rend liste et 2 du modèle le rend tableau.

Une autre condition serait de les adapter, si possible(aka modèles de changement comme vous le redimensionnement de la fenêtre)

Au moment où je peux utiliser la solution de questions ci-dessus, mais existe-il d'autres façons de le faire?

Hava-vous envisagé d'utiliser Bootstrap ?
Oui, il y a deux options, nous sommes à la recherche à maintenant - one est un modèle de permutation deuxième est un pur CSS. Il pourrait y avoir beaucoup de changements à la structure afin je suis de vérifier si le modèle/la directive échange est possible avec beaucoup de piratage

OriginalL'auteur Kocur4d | 2015-10-23

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *