在AngularJS中Knockout的可写计算可观察量的模拟是什么?

Gir*_*afa 14 javascript angularjs knockout.js

我在我的项目中使用KnockoutJS,但想学习AngularJS,因为它有很多Knockout没有的美味功能.所以我有兴趣使用Angular重写我的一些代码.但我不明白如何做一些我在Knockout中使用的简单事情.例如,Knockout具有计算的可观察量的特征.这很酷!我已经发现我可以使用一个简单的函数.但是Knockout为计算的observable提供了"write"函数,例如:

var first_name = ko.observable('John'),
    last_name = ko.observable('Smith'),
    full_name = ko.computed({
        read: function(){
            return first_name() + ' ' + last_name();
        },
        write: function(new_value){
            var matches = new_value.match(/^(\w+)\s+(\w+)/);

            first_name(matches[1]);
            last_name(matches[2]);
        }
    });
Run Code Online (Sandbox Code Playgroud)

JSFiddle上的这段代码:http://jsfiddle.net/Girafa/QNebV/1/

此代码允许我在更改"full_name"时更新"first_name"和"last_name"observable.如何使用AngularJS完成?检查存在参数的函数?像这样的东西?

first_name = 'John';
last_name = 'Smith';
full_name = function(value){
    if (typeof value != 'undefined')
    {
        // do the same as in the Knockout's write function
    }
    else
    {
        // do the same as in the Knockout's read function
    }
}
Run Code Online (Sandbox Code Playgroud)

什么是最佳做法?

Gir*_*afa 12

我找到了这样一个解决方案:http://jsfiddle.net/Girafa/V8BNc/

我们设置了原始的javascript getter和fullName属性的setter,而不是使用angular $ watch方法:

Object.defineProperty($scope, 'fullName', {
    get: function(){
        #...
    },
    set: function(newValue){
        #...
    }
})
Run Code Online (Sandbox Code Playgroud)

认为这更方便,因为我不需要在代码中创建任何特殊的观察者.但我不知道该解决方案的浏览器支持.

  • 万一有人担心,[浏览器支持是IE9 +](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty) (3认同)