Durandaljs и Knockoutjs - привязки данных не работают

Я постараюсь быть максимально кратким. Я использую DurandalJs, шаблон SPA HotTowel. Я добавил следующую модель просмотра

define(['services/logger'], function (logger) {
    title = 'Content';
    unpublishedContent = ko.observable('default');

    activate = function() {
        logger.log(title + ' View Activated', null, title, true);
        return true;
    }

    unpublishedContent.subscribe(function (newValue) {
        logger.log('New value is: ' + newValue);
    });
    return {
        activate: activate,
        title: title,
        unpublishedContent: unpublishedContent,
        save: function (data) {
            self = this;
            logger.log(' Content saved - ' + self.unpublishedContent(), null, title, true);
        }
    };
});

И следующий взгляд

<section>
    <div class="row">
        <div class="col-md-4">Left section</div>
        <div class="col-md-8">
            <form class="form-horizontal" role="form" data-bind="submit: save">
                <div class="form-group">
                    <label for="html" class="col-lg-3">Html</label>
                    <div class="col-lg-9">
                        <textarea class="form-control" data-bind="text: unpublishedContent"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-lg-3">Your HTML</label>
                    <label class="col-lg-9" data-bind="text: unpublishedContent"></label>
                </div>
                <div class="form-group">
                    <div class="col-lg-offset-3 col-lg-9">
                        <button type="submit" class="btn btn-default">Save</button>
                    </div>
                </div>

            </form>
        </div>
    </div>
</section>

Несколько моментов, на которые следует обратить внимание.

  1. unpublishedContent свойство ko.observable
  2. unpublishedContent привязан к текстовой области и метке
  3. Метод save должен формироваться с использованием привязки submit

Пока моя привязка отправки работает, привязка к unpublishedContent не работает. Возможно, я где-то делаю простую ошибку, но я не могу заметить, возможно, мне нужна вторая пара глаз, смотрящая на это.

Я включил отладку в дюрандале, но во-первых, я мало что получаю от ведения журнала дюрандала, он не показывает ничего, связанного с ko, а во-вторых, я думаю, что я слишком новичок в дюрандале, чтобы понять его отладочные сообщения.


knockout.js durandal
person Suhas    schedule 20.10.2013    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Вы используете неправильную привязку (text) на своем <textarea>. Что вам нужно, так это привязка value.

Из документации:

Привязка value связывает значение связанного элемента DOM со свойством вашей модели представления. Обычно это полезно для таких элементов формы, как <input>, <select> и <textarea>.

Поэтому измените свое представление на:

<textarea class="form-control" data-bind="value: unpublishedContent"></textarea>
person nemesv    schedule 20.10.2013
comment
это сработало идеально. Любая идея, что мне нужно использовать для привязки label. У меня есть метка в моем html выше, привязка к тому же свойству. Когда я набираю текстовое поле, я хочу, чтобы метка подбирала текст в текстовом поле и отображала его. - person Suhas; 21.10.2013
comment
для метки вам все еще может понадобиться использовать привязку text. Но если вы хотите получить мгновенное обновление, вам нужно использовать параметр valueUpdate: 'afterkeydown' в привязке value: jsfiddle.net/fCa6y - person nemesv; 21.10.2013