与Knockout相比,Angular中对象的表示方式

Ways of representing objects in Angular in comparison to Knockout

本文关键字:对象 表示 方式 Angular Knockout 相比      更新时间:2023-09-26

我有使用Knockout框架的经验。

在Angular中,写下面代码最干净的方式是什么?

下面的代码是Knockout代码,它描述了一个包含汽车对象数组的汽车库存对象。

在Angular中,可能有多种方法可以做到这一点。如果你知道一种方法,它没有在这里列出,请提出它。

这个问题的起源来自于我和同事在工作中关于Angular是否比Knockout更优雅的争论。我问了他我在这里陈述的同样的问题,几天后他无法回答我,这意味着这真的很难或不可能(我怀疑)。


<script type='text/javascript' src='knockout-3.1.0.js'></script>
<script>
function tire() {
    var self = this;
    //write properties and methods about tire here
}
function door() {
    var self = this;
    //write properties and methods about door here
}

function engine( car_parent ) {
    var self = this;
    //write properties and methods about engine here
}

function car() {
    var self = this;
    self.tires = [new tire(), new tire(), new tire(), new tire() ];
    self.doors = [new door(), new door(), new door(), new door() ];
    //below gives the engine child access to its car parent
    self.engine = new engine(self);
    //write other properties and methods about a car here
}

function carInventory() {
    var self = this;
    self.cars = [new car(),  new car(), new car()];
    //write properties and methods about the car inventory here
}
var vm = new carInventory();
ko.applyBindings(vm);
</script>   

我看不出你的例子在Angular中会有什么不同。与Knockout中的ko.applyBindings(vm)不同,你可以在Angular的控制器中连接视图模型:

var app = angular.module('App',[])
.controller('Controller1', function($scope){
    $scope.inventory = new carInventory();
}); 

与Angular的一个主要区别是,你不必把对象上的属性变成可观察对象和可计算对象。