Angularjs 使用 Object.create 创建范围对象答案

【问题标题】：Angularjs create scope object using Object.createAngularjs 使用 Object.create 创建范围对象
【发布时间】：2014-06-26 14:37:36
【问题描述】：

我正在通过构建 Web 应用程序来学习 AngularJS。在我的服务模块中有一个原型对象（在小提琴中，我在控制器中模拟了它）。

现在，当我尝试在小提琴中更新子元素 - repeatableInfo - 时，它没有设置。我的猜测是，在 JavaScript 中对象是作为引用传递的。当使用 Object.create 时，会创建一个新的对象副本，并且所有属性都成为原型属性？

    var apiData={};
apiData.formObjectProto = {
    'commonInfo': '',
    'repeatableInfo': [
        {'aInfo': ''}
     ]
};

$scope.mainObj = Object.create(apiData.formObjectProto);

当它被如下替换时，一切正常。

 var apiData={};
apiData.formObjectProto = {
    'commonInfo': '',
    'repeatableInfo': [
        {'aInfo': ''}
     ]
};

//$scope.mainObj = Object.create(apiData.formObjectProto);
$scope.mainObj = {
    'commonInfo': '',
    'repeatableInfo': [
        {'aInfo': ''}
     ]
};

所以我的问题是，我们不能在 Angular 中使用 OOP 概念吗？或者我缺少一些东西。请帮忙

JS Fiddle

更新 1

使用以下帮助。那么，不推荐使用 Object.create()，而是使用 angular.copy() 来创建原型对象的克隆？

$scope.mainObj = angular.copy(apiData.formObjectProto);

【问题讨论】：

标签： angularjs prototype angularjs-scope

【解决方案1】：

我认为为了更好地符合 Angular 的设计模式集，应该使用不同的方法来在每次注入时新建该映射的新实例。

var deps, appModule;
deps = [];
appModule = angular.module('myApp', deps);
appModule.factory('myAppFactory', function() {

    var factory = {};

    factory.formObjectProto = {
        'commonInfo': '',
        'repeatableInfo': [
            {'aInfo': ''}
         ]
    };

    return factory;
});

appModule.controller('myAppCtrl', function ($scope, myAppFactory) {
    $scope.mainObj = myAppFactory;
    console.log('myAppCtrl# $scope.mainObj is: ' + JSON.stringify($scope.mainObj));

});

appModule.controller('oneInfoCtrl', function ($scope) {
    $scope.$watch('oneInfo.aInfo', function (newValue, oldValue){
        console.info('oneInfoCtrl watch# New value of oneInfo.aInfo is: ' + newValue);
    });

    $scope.$watch('mainObj.commonInfo', function (newValue, oldValue){
        console.info('mainObj.commonInfo watch# New value of commonInfo (present in $parent) is: ' + newValue);
    });
});

这将完成您在更新中所做的事情，但更符合 OOP 原则。

【讨论】：