Question

我正在通过构建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': ''}
     ]
};

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

JS Fiddle

更新1

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

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

Answer 1

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

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原则。

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

1 个答案: