如何将具有数据绑定的变量放在同一行

how to put variables with data binding in the same line

我是 knockoutjs 的新手,我想将变量与我在同一行中提供的文本放在一起,但即使我放置了 CSS 样式,我也找不到如何去做,没有 css 风格,谁能帮助我?

 <div>
  <p>Age :</p>
 <div> <!--ko text: (person_age) --><!-- /ko --><p>year(s)</p></div>
 </div>

这段代码对我的结果是:

Age :
20
years(s)

我想要这样:

Age :
20 years(s)

将字符串 "years" 向下推到新行的是包裹字符串的段落标记。为了得到你想要的,我会这样重写它:

<p><span data-bind="text:person_age"></span> years</p>

这样 person_age 和 "years" 的值将在同一行。段落标签就是所谓的 "block level element" ,意思是它将内容显示为块。跨度就是所谓的内联元素。在此处了解更多信息:https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements.

另请注意,您使用的是击倒 "containerless syntax"。我通常回避使用它,因为你可以使用更简洁的 data-bind attribute 来完成大部分你需要做的事情。这样你就可以坚持使用常规的 HTML 标签而不使用 <!----> 我认为 ko 设计者打算将其用作最后的策略,如果使用标签会丑。