Maison > interface Web > js tutoriel > liste ionique non ordonnée

liste ionique non ordonnée

黄舟
Libérer: 2017-02-16 14:15:08
original
1089 Les gens l'ont consulté

1. Exemple d'arrière-plan

La liste non ordonnée ionique est implémentée à l'aide de ul-li, le contenu de la liste non ordonnée est attribué par AngularJS et le style est class=" list "et class="item"


2. Code source d'implémentation

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>ionic之无序列表</title>
		<link rel="stylesheet" href="../css/ionic.css" />
		<script type="text/javascript" src="../js/angular/angular.js" ></script>
		<script type="text/javascript" src="../js/ionic.bundle.js" ></script>
		<script>
			var app = angular.module("ulApp",["ionic"]);
			app.controller("ulController",function($scope){
				$scope.uls = ["春季","夏季","秋季","冬季"];
			});
		</script>
	</head>
	<body ng-app="ulApp" ng-controller="ulController">
		<p style="padding: 100px;">
			<ul class="list">
				<li class="item" ng-repeat="u in uls">{{u}}</li>
			</ul>
		</p>
	</body>
</html>
Copier après la connexion


3. Résultats de réalisation

liste ionique non ordonnée

Ce qui précède est le contenu de la liste ionique, non ordonnée et de JavaScript. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal