Question

看起来很简单，但它让我发疯了。我在视图中有一个输入助手：

{{input value=contact.fullName type="text" style="text-align:left;"}}

在我的contact模型中，我有这些属性和这个计算属性：

firstName: DS.attr('string'),
lastName: DS.attr('string'),

fullName: function (key, value, previousValue) {
    if(arguments.length > 1){
        var nameParts = value.split(/\s+/);
        this.set('firstName', nameParts[0], this.get('firstName'));
        this.set('lastName', nameParts[1], this.get('lastName'));
    }
    return this.get('firstName') + ' ' + this.get('lastName');
}.property('firstName', 'lastName')

很好，所以我输入＃34; Joe Bob＆＃34;在我的输入中，它在整个页面上进行了更新。但是当我删除＆＃34; Bob＆＃34;我在输入中得到了这个：＆＃34; Joe undefined＆＃34;。如果我删除＆＃34; Joe＆＃34;，如果我这样做，我最终会以＆＃34;鲍勃＆＃34 ;.
如何防止undefined进入我的观点？

在这2天，任何帮助将不胜感激。

Answer 1

当你删除Joe时它会起作用，因为在Bob之前有一个空格，所以你最终会得到一个类似于＆＃39;的字符串。 Bob＆＃39;，当你在if中分割值时，它使用B之前的空格，这就是它工作的原因。当你删除Bob时它不起作用，因为Joe之后没有空格，所以，当你尝试访问nameParts [1]时，它会返回你未定义的那个＆＃39;那个＆＃39; ;为什么你得到乔未定义＆＃39;。你可以尝试这样的事情：

this.set('firstName', nameParts[0], this.get('firstName'));
this.set('lastName', nameParts[1] || '', this.get('lastName'));

你最终会得到Joe＆＃39;最后有一个额外的空间，如果这对你有用，那就没关系了，否则你需要删除额外的空间。

Answer 2

因此更改了函数的返回，这允许用户删除整个输入，这就是我的目标。

fullName: function (key, value) {
    if(arguments.length > 1){
        var nameParts = value.split(/\s+/);
        this.set('firstName', nameParts[0]);
        if(nameParts[1]===undefined){
            return this.get('firstName');
        }
        this.set('lastName', nameParts[1]);
    }
    return this.get('firstName') + ' ' + this.get('lastName');
}.property('firstName', 'lastName')

未定义的返回意味着从那时起它只返回第一个名称，它可以整齐地处理问题。

使用computed属性作为ember把手输入助手的值，删除部分返回undefined

2 个答案: