Olá! Segue código:
window.onload = function () {
var viewModel = function () {
var self = this;
self.label1 = "Label 1: ";
self.label2 = "Label 2: ";
self.show = "";
self.input1 = ko.observable();
self.input2 = ko.observable();
self.button = function () {
self.show = ko.pureComputed(function () {
if (self.input1() != undefined || self.input2() != undefined) {
self.show = self.input1() + ' ' + self.input2();
}
}, this);
}
};
ko.applyBindings(new viewModel());
};
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title> Knouckout </title>
<script type="text/javascript" src="jquery3.4.1.js"></script>
<script type="text/javascript" src="knockout-3.5.1.js"></script>
<script type="text/javascript" src="javascript.js"></script>
<style>
input {
width: 80px;
}
button {
width: 30px;
}
</style>
</head>
<body>
<div style="display: flex; flex-direction: column">
<span data-bind="text: label1"></span>
<input data-bind="value: input1">
<span data-bind="text: label2"></span>
<input data-bind="value: input2">
<button data-bind="click: button"> + </button>
<input disabled data-bind="value: show">
</div>
</body>
</html>
Tenho essa pequena tela, onde são inseridos dois valores, e tenho como objetivo, pegar esse valores (caso não sejam undefined) e mostrar em um único input disabled quando clicado no button. Para isso, considerei usar o pureComputed que seria mais indicado para tal, conforme pesquisei na documentação. Mas, quando clico no button, nada acontece. Alguém saberia informar o que há de errado? Grato pela atenção!