andyyou/gist:5558660

## gistfile1.txt
<!doctype html>
<html>
<head>
	<meta charset='utf-8' />
	<title>Helo, Backbone View</title>
	<style>
	#container {
		padding:20px;
		border:1px solid #333;
		width:400px; }
	#template { display:none; }
	</style>
</head>
<body>
<div id="container">
    <button>Load</button>
    <ul id="list">
    </ul>
</div>

<script type="text/template" id='tlp_list'>
<li><%= text %></li>
</script>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script>
(function($){
	links = new Backbone.Model({
		data:
		[
			{text:'Google',href:'http://www.google.com'},
			{text:'Yahoo!',href:'http://tw.yahoo.com'},
			{text:'Facebook',href:'http://www.facebook.com'}
		]
	});

	AppView = Backbone.View.extend({
		el: '#container',
		initialize: function()
		{
			console.log('app initialized');
		},
		events:
		{
			'click button': 'render'
		},
		render: function()
		{
			var datasource = this.model.get('data');
			var el = $(this.el); // _each block 內取不到 this，所以要先取。
			_.each(datasource, function(d){
				var template = _.template($("#tlp_list").html(), {text: d.text} );
				el.find('ul').append(template);
			});

		}
	});
	var app = new AppView({model: links });
})(jQuery);

</script>
</body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset='utf-8' />
	<title>Helo, Backbone View</title>
	<style>
	#container {
	padding:20px;
	border:1px solid #333;
	width:400px; }
	#template { display:none; }
	</style>
	</head>
	<body>
	<div id="container">
	<button>Load</button>
	<ul id="list">
	</ul>
	</div>

	<script type="text/template" id='tlp_list'>
	<li><%= text %></li>
	</script>


	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
	<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
	<script>
	(function($){
	links = new Backbone.Model({
	data:
	[
	{text:'Google',href:'http://www.google.com'},
	{text:'Yahoo!',href:'http://tw.yahoo.com'},
	{text:'Facebook',href:'http://www.facebook.com'}
	]
	});

	AppView = Backbone.View.extend({
	el: '#container',
	initialize: function()
	{
	console.log('app initialized');
	},
	events:
	{
	'click button': 'render'
	},
	render: function()
	{
	var datasource = this.model.get('data');
	var el = $(this.el); // _each block 內取不到 this，所以要先取。
	_.each(datasource, function(d){
	var template = _.template($("#tlp_list").html(), {text: d.text} );
	el.find('ul').append(template);
	});

	}
	});
	var app = new AppView({model: links });
	})(jQuery);

	</script>
	</body>
	</html>