尝试连接两个使用 Knockoutjs 的 span 字段

本文关键字:Knockoutjs 字段 span 两个 连接 | 更新日期: 2023-09-27 18:34:29

我刚刚开始使用淘汰.js并且我得到了很好的结果,但我有一个小问题:

我有一个 JSON 中的列表,用于构建模板:

以下是列表和制定列表的代码:

 public IEnumerable<dynamic> TheaterList { get; set; }
        List<TheaterTest> theaters = new List<TheaterTest>(); 
        protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                getTheaters();
                TheaterList = theaters;
            }
        }
        protected void getTheaters()
        {
            theaters.Add(new TheaterTest()
            {
                theater_dist = "3",
                theater_name = "Regal Webster Place 11",
                theater_add1 = "1471 W. Webster Ave",
                theater_add2 = "",
                theater_city = "Chicago",
                theater_state = "Il",
                theater_postcode = "60614",
                theater_phone = "(762) 711-9180"
            });
            theaters.Add(new TheaterTest()
            {
                theater_dist = "4.2",
                theater_name = "Regal Washington Park 9",
                theater_add1 = "1341 W Webster Ave",
                theater_add2 = "",
                theater_city = "Chicago",
                theater_state = "Il",
                theater_postcode = "60614",
                theater_phone = "(762) 711-9180"
            });

这是在 .ascx 中构建 JSON 的代码

<script>
    var d = {};
    d.theaterList = <%= Newtonsoft.Json.JsonConvert.SerializeObject(TheaterList) %>  ;
    $(document).ready(function () {
        ko.applyBindings(new theaterSel.TheaterModel(d.theaterList));
    });
</script>

这是我的模板:

<div class="theatre-info">
            <div class="theater-name">
                <a data-bind="attr: { href: ''}"><span class="theater-link" data-bind="    text: theater_name" /></a>
            </div>
            <div class="theatre-address" data-bind="text: theater_add1, text: theater_add2"></div>
            <div class="theatre-address" data-bind="text: theater_city + text: theater_state + text: theater_postcode"></div> 
            <div class="theatre-phone" data-bind="text: theater_phone"></div>
            <button>My Theatre</button>
        </div>
    </li>

我想连接theater_city、theater_state和theater_postcode:我想我可以使用"ko.compute ...但我只是不确定如何创建该功能。任何帮助将不胜感激。

提前谢谢你。

尝试连接两个使用 Knockoutjs 的 span 字段

是的,你走在正确的轨道上——

在您的视图模型中

var computedName = ko.computed(function () {
    return theater_city + ', ' + theater_state + ', ' + theater_postcode;
});

在您看来

<h1 data-bind="text: computedName"></h1>