Knockoutjs observablearray刷新值

时间:2017-07-10 08:07:26

标签: asp.net-mvc knockout.js

我使用knockoutjs模板绑定列出我的状态消息。我的状态信息有点数。我想当ı点击我喜欢的按钮刷新我的喜欢计数在哪里ı点击它。怎么做我的淘汰模型代码

{
"Android": [
    {
        "name": "Go to Market tomorrow",
        "imagePath": "01-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "Android"
    },
    {
        "name": "Email to manager",
        "imagePath": "02-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "Android"
    },
    {
        "name": "Go For Running",
        "imagePath": "04-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "Android"
    },
    {
        "name": "Go to Movie",
        "imagePath": "05-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "Android"
    },
    {
        "name": "Go to Home",
        "imagePath": "06-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "Android"
    },
    {
        "name": "Schneider Electric",
        "imagePath": "test.jpg",
        "description": "Explore and put Schneider Electric and Square D products and solutions at your fingertips! This app offers interactive 3D product demonstrations of features, benefits and product overviews. Many offer removable modules to see inside and all can be viewed in 360 degree rotation.",
        "TechnologyName": "Android"
    }
],
"IOS": [
    {
        "name": "Push code to GitHub",
        "imagePath": "03-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "IOS"
    }
],
"UNITY": [
    {
        "name": "Go to office",
        "imagePath": "07-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "UNITY"
    },
    {
        "name": "Push code to finish",
        "imagePath": "08-screenshot.jpg",
        "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
        "TechnologyName": "UNITY"
    }
]
}

和我喜欢的按钮clik代码

 var viewModel = {
            messages: ko.observableArray()
        };
        ko.options.useOnlyNativeEvents = true;
        ko.applyBindings(viewModel);
        $.getJSON('@Url.Action("statusMessages", "Home")', function (data) {
            viewModel.messages(data);
        });

和我的按钮html代码

var LikeButtonClick = function (id) {

            $.getJSON('@Url.Action("Like", "Home")/' + id).done(function (d) {
                if (d.State) 
                    toastr.info("Beğendiniz.");
                else
                    toastr.error("Beğenmekten Vazgeçtiniz");

                var message = ko.utils.arrayFirst(viewModel.messages(), function (currentMessage) {
                    return currentMessage.MessageId == d.Id; 
                });
                if (message) {
                    console.log(message.MessageId)
                    // refresh
                }

            })
        };

1 个答案:

答案 0 :(得分:0)

您似乎在某个地方有一个名为LikeCount的可观察属性,但您没有将其包含在问题中。

你需要做的地方:

var viewModel = {
        messages: ko.observableArray(),
LikeCount: ko.observable();
    };

并且在你的json中你需要更新那个observable:

viewModel.LikeCount(data.LikeCount); //or similar