devdays/ojs-knockout-attributebindings.html

## ojs-knockout-attributebindings.html
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        .redItem {
            color: red;
        }
        .greenItem {
            color: green;
        }
    </style>
</head>
<body>
    <div data-bind="html: someHtml"></div>
    <div>And a link <a data-bind="attr: { href: myHref }">#</a></div>
    <div data-bind="css: profitStatus, text: currentProfit"></div>
    <button data-bind="click: reviseProfit">Revise Profit</button>

    <script src="Scripts/knockout-2.2.1.debug.js"></script>
    <script>
        var viewModel = function () {
            this.someHtml = "Here is a <strong>bold</strong> text.";
            this.myHref = "#";

            this.currentProfit = ko.observable(150000);

            this.profitStatus = ko.computed(function () {
                return this.currentProfit() < 0 ? "redItem" : "greenItem";
            }, this);


            this.reviseProfit = function () {
                this.currentProfit(-50);
            };
        };

        ko.applyBindings(new viewModel());
    </script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title></title>
	<style>
	.redItem {
	color: red;
	}
	.greenItem {
	color: green;
	}
	</style>
	</head>
	<body>
	<div data-bind="html: someHtml"></div>
	<div>And a link <a data-bind="attr: { href: myHref }">#</a></div>
	<div data-bind="css: profitStatus, text: currentProfit"></div>
	<button data-bind="click: reviseProfit">Revise Profit</button>

	<script src="Scripts/knockout-2.2.1.debug.js"></script>
	<script>
	var viewModel = function () {
	this.someHtml = "Here is a <strong>bold</strong> text.";
	this.myHref = "#";

	this.currentProfit = ko.observable(150000);

	this.profitStatus = ko.computed(function () {
	return this.currentProfit() < 0 ? "redItem" : "greenItem";
	}, this);


	this.reviseProfit = function () {
	this.currentProfit(-50);
	};
	};

	ko.applyBindings(new viewModel());
	</script>
	</body>
	</html>