[JS] Use repeat and list directives in AngularJS

最新推荐文章于 2020-08-19 14:02:47 发布

wonderfan

最新推荐文章于 2020-08-19 14:02:47 发布

阅读量879

点赞数

分类专栏： JavaScript_CSS 文章标签： angularjs js

本文链接：https://blog.csdn.net/wonderfan/article/details/20128681

版权

JavaScript_CSS 专栏收录该内容

36 篇文章 0 订阅

订阅专栏

This code snippets show how to use directives in AngularJS?

<!DOCTYPE html>
<html ng-app="MyApp">
<head>
	<title>AngularJS</title>
	<script src="lib/angular.js"></script>
</head>
  <body>
    <div class="content"  ng-controller="TestDirectiveController">
		<form name="myForm">
			<label>List:</label>
			<input name="city" ng-model="citys" ng-list required />
		</form>
		<hr>
		<ul>
			<li ng-repeat="city in citys" >{{city}} {{$index}}</li>
		</ul>
	</div>
    
	<script type="text/javascript">
		var MyApp = angular.module("MyApp",[]);
		MyApp.controller("TestDirectiveController",function($scope){
			$scope.citys = ["BeiJing","ShangHai","ShenZhen"];
			
		});
	</script>
	<!--
		How does the ng-list directive work?
		1.Use ng-model to bind the property in the current scope;
		2.Register the formatter function into the controller.
		
		The ng-repeat directive in depth:
		1.Get the ng-repeat expression from the element's attribute;
		2.Ues Regalar expression to break it into different matches;
		3.Get the collection from the scope and iterate the collection with template clone.
	-->
  </body>
</html>