Last active
September 17, 2016 13:26
-
-
Save geleto/4bf7ef1466a13a03b9966114f17cacf2 to your computer and use it in GitHub Desktop.
Different behaviour with number and string getter
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<template> | |
<select value.two-way="optionId"> | |
<option repeat.for="choice of options" value.bind="$index">${choice}</option>) | |
</select> | |
<label>Number</label> | |
<br><br> | |
<select value.two-way="optionId2"> | |
<option repeat.for="choice of options" value="${$index}">${choice}</option>) | |
</select> | |
<label>String</label> | |
<br><br> | |
<button click.delegate="changeValues()">Change values to three</button> | |
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export class App { | |
options = [ 'one', 'two', 'three' ]; | |
_optionId = 1; | |
get optionId(){ | |
return this._optionId; | |
} | |
set optionId(newValue){ | |
console.log( "option="+newValue+", type is " + typeof(newValue) ); | |
this._optionId = parseInt(newValue); | |
} | |
_optionId2 = "1"; | |
get optionId2(){ | |
return this._optionId2; | |
} | |
set optionId2(newValue){ | |
console.log( "option2="+newValue+", type is " + typeof(newValue) ); | |
this._optionId2 = newValue; | |
} | |
changeValues(){ | |
this.optionId = 2; | |
this.optionId2 = "2"; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<title>Different behaviour with number and string getter</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
</head> | |
<body aurelia-app> | |
<h1>Loading...</h1> | |
<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/jspm_packages/system.js"></script> | |
<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/config.js"></script> | |
<script> | |
System.import('aurelia-bootstrapper'); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment