1

如果他等于某个字符串，我想检查我的“类型”绑定，但看起来他没有执行它。

我的html页面：

 <div class="socialWrapper" data-bind="foreach: facebookposts">
         <!-- ko if: {Type()==='link'}-->
         <img data-bind='attr: { src: FromPicture }'/>
         <p data-bind="text:From"></p>
         <!-- /ko -->
 </div>

当我刚回来时：

<p data-bind="text: Type"></p>

我的输出=“字符串”

如您所见，我想根据 if 语句获得正确的 observables。视图模型：

function Post(allData) {
    var profileImageUrl = "http://graph.facebook.com/" + allData.from.id + "/picture?type=large";
    this.Type = ko.observable(allData.type);
    this.From = ko.observable(allData.from.name);
    this.FromPicture = ko.observable(profileImageUrl);
    this.Created = ko.observable(allData.created_time);
    this.Comments = ko.observable(allData.comments.count);
    this.Message = "";
    this.Likes = "";
    this.LinkImage = "";
    this.LinkUrl = "";
    this.LinkName = "";
    this.LinkTitle = "";
    this.LinkDescription = "";
    this.Story = "";
    this.Photo = "";
    this.PhotoDescription = "";


    if (allData.type === 'status') {
        this.Message = ko.observable(allData.message);
        this.Likes = ko.observable(allData.likes);
    }
    if (allData.type === 'link') {
        this.Message = ko.observable(allData.message);
        this.LinkImage = ko.observable(allData.picture);
        this.LinkUrl = ko.observable(allData.link);
        this.LinkName = ko.observable(allData.name);
        this.LinkTitle = ko.observable(allData.caption);
        this.LinkDescription = ko.observable(allData.description);
        this.Likes = ko.observable(allData.likes);
    }
    if (allData.type === 'photo') {
        this.Story = ko.observable(allData.story);
        this.Photo = ko.observable(allData.picture);
        this.PhotoDescription = ko.observable(allData.description);
    }
}

    var masterViewModel = { 
        facebookposts: ko.observableArray([]),
        getFacebookObjects: function () {
            var getUrl = '/api/facebookposts?accesstoken=@Session["fb_access_token"]';
            $.ajax({
                url: getUrl,
                type: 'GET',
                dataType: 'json',
                success: function (allData) {
                    var mappedPosts = $.map(allData, function (item) {
                        return new Post(item);
                    });
                    masterViewModel.facebookposts(mappedPosts);
                },
                statuscode: {
                    401: function () {
                        console.log("Not Authorized");
                    }
                }
            });
        }
     };

$(document).ready(function () {
    ko.applyBindings(masterViewModel);
    masterViewModel.getFacebookObjects();
});

任何人都知道如何解决这个 if 语句？

4

2 回答 2

3

更新- 使用整个视图模型

我会在你的视图模型上做一个计算的 observable，看起来像这样

function Post(allData) {
    var profileImageUrl = "http://graph.facebook.com/" + allData.from.id + "/picture?type=large";
    this.Type = ko.observable(allData.type);
    this.From = ko.observable(allData.from.name);
    this.FromPicture = ko.observable(profileImageUrl);
    this.Created = ko.observable(allData.created_time);
    this.Comments = ko.observable(allData.comments.count);
    this.Message = "";
    this.Likes = "";
    this.LinkImage = "";
    this.LinkUrl = "";
    this.LinkName = "";
    this.LinkTitle = "";
    this.LinkDescription = "";
    this.Story = "";
    this.Photo = "";
    this.PhotoDescription = "";

    var self = this;
    this.isLink = ko.computed(function() {
        return self.Type() === 'link';
    });

    if (allData.type === 'status') {
        this.Message = ko.observable(allData.message);
        this.Likes = ko.observable(allData.likes);
    }
    if (allData.type === 'link') {
        this.Message = ko.observable(allData.message);
        this.LinkImage = ko.observable(allData.picture);
        this.LinkUrl = ko.observable(allData.link);
        this.LinkName = ko.observable(allData.name);
        this.LinkTitle = ko.observable(allData.caption);
        this.LinkDescription = ko.observable(allData.description);
        this.Likes = ko.observable(allData.likes);
    }
    if (allData.type === 'photo') {
        this.Story = ko.observable(allData.story);
        this.Photo = ko.observable(allData.picture);
        this.PhotoDescription = ko.observable(allData.description);
    }
}

然后

<div class="socialWrapper" data-bind="foreach: facebookposts">
         <!-- ko if: isLink -->
         <img data-bind='attr: { src: FromPicture }'/>
         <p data-bind="text:From"></p>
         <!-- /ko -->
</div>

就我个人而言，我喜欢尽可能保持我的观点干净，这意味着没有 javascript 评估。更好地分离关注点。

于 2012-04-26T14:17:43.303 回答
0

我认为您需要使用 $parent 上下文绑定。试试这个 -

 <div class="socialWrapper" data-bind="foreach: facebookposts">
     <!-- ko if: $parent.Type === 'link'-->
     <img data-bind='attr: { src: FromPicture }'/>
     <p data-bind="text:From"></p>
     <!-- /ko -->
 </div>

http://jsfiddle.net/belthasar/DaN2X/

于 2012-04-26T14:27:38.510 回答