• PKey Framework •

2 way data binding

				
<input class="form-control" type="text" pk-model="title">
<p pk-bind="title"></p>

Statements if/else

  • Step 1: Mix flour and salt in large bowl
  • Step 2 (click to see): Fill with apple mixture; set aside 
				
Step 1: <span pk-if="true">Mix flour and salt in large bowl</span>
Step 2: <span pk-if="isShown">Fill with apple mixture; set aside</span>

Action handlers

				
<button class="btn btn-primary" pk-onclick="buttonClick()">
	Click me
</button>
			
				
<div class="form-group">
	<input type="checkbox" pk-oncheck="checkboxClick()">
</div>
			
				
<form class="form-inline" pk-onsubmit="submitClick('Form is submitted')">
	<button type="submit" class="btn btn-light">Submit</button>
</form>

Loops

Ingredients list:
  • {{ $item }} 
				
<ul>
	<li pk-for="$item in ingredients">
		 {{ $item }}
	</li>
</ul>