javascript - 当 Knockout observable 未定义或禁用 JS 时显示默认值

Question

使用 Knockout.js，如果绑定(bind)到元素的可观察对象未定义，是否有办法显示元素的原始内容？

<p data-bind="text: message">Show this text if message is undefined.</p>

<script>
    function ViewModel() {
        var self = this;        
        self.message = ko.observable();    
    };

    ko.applyBindings(new ViewModel());
</script>

我知道有使用 visible 的解决方法, hidden或 if但我觉得那些太乱了；我不希望同一个元素被写出两次，每个条件一次。

此外，我不想使用任何类型的默认可观察值。走那条路，如果 JS 被禁用，那么什么也不会显示。爬虫也一样:他们只会看到一个空的 <p>。标签。

总而言之，我想说“如果存在则显示这条消息，否则就不要管元素及其文本。”

这背后的原因是我想首先使用 Razor 填充我的元素。

<p data-bind="text: message">@Model.Message</p>

然后，在浏览器中，如果启用了 JS，我可以随心所欲地使用它。但是，如果没有 JS 或者用户是爬虫，他们至少会看到服务器端通过 Razor 提供的默认值。

Answer 1

如果 message 未定义，您可以简单地使用 || 运算符来显示默认消息。加上默认文本作为内容:

<p data-bind="text: message() || '@Model.Message' ">@Model.Message</p>

如果 javascript 被禁用，绑定(bind)将被忽略，您将显示内容。

JSFiddle