javascript - 为什么我的 applyBindings 不起作用？昏死

Question

您好，我只是想创建输入和 iframe，当我粘贴 YouTube 链接时，iframe 应该随着新的 src 而改变。到目前为止我已经这样做了

<div class="heading">id <input data-bind="text: youtubeLink"/></div>
<iframe id="player" type="text/html" width="444" height="250" frameborder="0" data-bind="attr: { src: linkEmbed }"></iframe>

在脚本中:

function MyViewModel() {
    this.youtubeLink = ko.observable('https://www.youtube.com/watch?v=4UNkmlCKw9M');
    this.linkEmbed = ko.pureComputed({
        read: function () {
                var extract = this.youtubeLink().replace("/watch?v=", "/embed/");
                console.log(extract)
                return extract;
        },
        write: function (value) {
                 this.youtubeLink();
        },
        owner: this
    });
}
ko.applyBindings(MyViewModel());

这完全符合我的要求，但如果我在输入中粘贴另一个链接，视频不会改变。

我正在使用来自 knockout 文档的这个:http://knockoutjs.com/documentation/computed-writable.html

Answer 1

你有几个问题:

1. 您没有在模型上调用 new，而是将其编写为构造函数
2. 您使用 text 绑定(bind)而不是 value 绑定(bind)输入
3. 你的计算器的写没有赋值，但你也不需要它

一旦您纠正了这些问题，它就会起作用。

function MyViewModel() {
    var model = {};
    model.youtubeLink = ko.observable('https://www.youtube.com/watch?v=4UNkmlCKw9M');
    model.linkEmbed = ko.pureComputed(function () {
        var result = model.youtubeLink().replace("/watch?v=", "/embed/")
        return result;
    });
    return model;
}
ko.applyBindings(MyViewModel());

http://jsfiddle.net/ueoob7ne/2/