2

在我看来：

<!-- ko if: !isEditingAboutMe() -->
<p data-bind="text: aboutMe()">@Model.AboutMe</p>
@if (Model.CurrentUserCanEdit)
{
    <a data-bind="click: editAboutMe">edit</a>
}
<!-- /ko -->
<!-- ko if: isEditingAboutMe() -->
@Html.TextBoxFor(model => model.AboutMe, new { data_bind = "value: aboutMe" })
<a data-bind="click: saveAboutMe(userId)">save</a>
<a data-bind="click: cancelAboutMe">cancel</a>
<!-- /ko -->

<script type="text/javascript">
$(document).ready(ko.applyBindings(new ProfileVm(@Html.Raw(Json.Encode(Model)))));
var userId = @Html.Raw(Json.Encode(User.Identity.Name));
</script>

我的视图模型：

function ProfileVm(model) {
var self = this;

self.aboutMe = ko.observable(model.AboutMe);

self.saveAboutMe = function (username) {
    dataservice().updateAboutMe(username, self.aboutMe());
    self.isEditingAboutMe(false);
};

self.cancelAboutMe = function() {
    self.isEditingAboutMe(false);
};

self.isEditingAboutMe = ko.observable(false);
self.editAboutMe = function() {
    self.isEditingAboutMe(true);
};
}

当我单击“编辑”时，DOM 会按预期更改，但会执行 saveAboutMe。只有当我点击“保存”时才应该执行它，因此点击：绑定。这是怎么回事？

4

1 回答 1

2

当您打开和关闭括号“saveAboutMe(userId)”时，您正在执行该函数，您只需在点击绑定上设置函数“saveAboutMe”的名称。

  1. 从函数调用中删除“（userId）”
  2. 在函数定义“saveAboutMe”中
  3. 您可以在函数中使用“userId”，因为它是全局的。

如果您希望将全局变量传递给您的“保存”函数，您可以做些什么来使其更清晰。

userId = @Html.Raw(Json.Encode(User.Identity.Name));

在您的点击绑定中：

<a data-bind="click: function(){saveAboutMe(userId);}">save</a>

您在这里所做的是定义一个匿名函数，当用户单击“保存”锚点时将调用“saveAboutMe”。这与您所做的不同之处在于，这里的匿名函数只是定义，而不是执行。

另一个更干净的事情是将 userId 添加到您的 ko ViewModel 并在函数中对其进行引用：

self.saveAboutMe = function (username) {
    console.log(self.userId); // this should work if you add your userId to your view model.
    dataservice().updateAboutMe(username, self.aboutMe());
    self.isEditingAboutMe(false);
};
于 2013-09-18T00:20:47.040 回答