1
Глядя на RivetsJS pull request 186, вы видите, что теперь вы можете создавать пользовательские теги (компоненты/виды многократного использования). Но я не видел никакой документации, которая показывает полный пример и как он работает.Как настроить компоненты Rivetsjs
Я пробовал следующее, но при загрузке страницы ничего не происходит. Любая помощь приветствуется
<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
<script type="text/javascript" src="rivets.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="cltemplate" id="auctionTemplate">
<section id="auction">
<h1>{auction.title}</h1>
<aside rv-show='auction.remaining'>
<h4>Hurry up!<h4>
<p>This auction is ending in { auction.remaining }.</p>
</aside>
<button rv-on-click="controller.bid" rv-disabled="auction.disabled">Place a bid</button>
</section>
</script>
<script type="text/javascript">
rivets.components.auction = {
attributes: [],
build: function() {
return $('#auctionTemplate').text();
}
}
var auctionModel = {title: "Selling A House", remaining: 20, disabled: false};
var controller = function(auction){
this.auction = auction;
this.bid = function() {
console.log('you bid...');
auction.remaining -= 10;
console.log('only ' + auction.remaining + ' remaining');
if(auction.remaining - 10 < 0) {
auction.disabled = true;
}
};
return this;
};
</script>
</head>
<body>
<rv-auction auction="auction" controller="controller"></rv-auction>
</body>
</html>