从 $scope 访问嵌套变量属性的简洁方法
Clean way to acces nested variable properties from the $scope
我想在 java 脚本文件中访问相同的变量属性,但由于属性太多,代码看起来有点难看。我有下一个代码:
$scope.invoice = new Invoice();
$scope.operations = {
editingLine: {},
isNewLine: false,
isEditOpen: false
};
$scope.modify = function (invoiceLine) {
if ($scope.operations.isEditOpen) return;
let originalLine = $scope.invoice.invoiceLines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
$scope.operations.editingLine[invoiceLine.id] = true;
$scope.operations.isEditOpen = true;
};
有什么方法可以访问在对象 invoice
上设置的 属性 invoiceLine
或设置的 属性 isEditOpen
以更简洁的方式在对象 operations
上?我的文件中有很多重复的代码,我想找到一种更简洁的方法来访问这样的属性。
我知道我可以定义一个变量 var operations = $scope.operations
并在我需要这个值时访问 属性 operations.isEditOpen
但是,我仍然想要更简单的东西,因为我不' 想要为范围内的所有对象创建变量。
有没有什么方法可以用两个 params
(objectFromScope, neededProperty
) 创建一个 function
,它可以 return 来自变量的所需 属性 值是在范围内设置的吗?或者,当我想从作用域访问对象 属性 时,有没有更好的方法可以不用这么多代码?
PS:我也可以这样做:
let editingLine = $scope.operations.editingLine;
let isNewLine = $scope.operations.isNewLine;
let isEditOpen = $scope.operations.isEditOpen;
$scope.modify = function (invoiceLine) {
if (isEditOpen) return;
let originalLine = invoiceLines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
editingLine[invoiceLine.id] = true;
isEditOpen = true;
};
但这是一个好方法吗?
Is there any way to create a function with two params ( objectFromScope, neededProperty )
that can return the required property value from a variable which is set on the scope? Or is there any better way to do not have such much code when I want to access an object property from the scope?
是的,但我看不出它如何为您省去任何麻烦。它还会使切换到 TypeScript 变得更加困难(尽管如果您不想取消引用整个 属性 路径,可以使它与 keyof
一起工作)。
但这是那个函数:
function getPropertyValue( objectFromScope, neededProperty ) {
const pathComponents = neededProperty.split( '.' );
let obj = objectFromScope;
for( const component of pathComponents ) {
obj = obj[ component ];
}
return obj;
}
用法:
$scope.invoice = new Invoice();
$scope.operations = {
editingLine: {},
isNewLine: false,
isEditOpen: false
};
$scope.modify = function( invoiceLine ) {
if ($scope.operations.isEditOpen) return;
const lines = getPropertyValue( $scope, 'invoice.invoiceLines' );
let originalLine = lines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
$scope.operations.editingLine[invoiceLine.id] = true;
$scope.operations.isEditOpen = true;
};
...但这并不能使您的代码更易于阅读或维护。相反,它使情况变得更糟,因为以这种方式做事对于 JavaScript 和 AngularJS 来说是非常不惯用的:在这个项目上工作的任何其他人都会盯着代码看几分钟然后挠头,然后才想知道首先大声说出你为什么要这样做。
我想在 java 脚本文件中访问相同的变量属性,但由于属性太多,代码看起来有点难看。我有下一个代码:
$scope.invoice = new Invoice();
$scope.operations = {
editingLine: {},
isNewLine: false,
isEditOpen: false
};
$scope.modify = function (invoiceLine) {
if ($scope.operations.isEditOpen) return;
let originalLine = $scope.invoice.invoiceLines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
$scope.operations.editingLine[invoiceLine.id] = true;
$scope.operations.isEditOpen = true;
};
有什么方法可以访问在对象 invoice
上设置的 属性 invoiceLine
或设置的 属性 isEditOpen
以更简洁的方式在对象 operations
上?我的文件中有很多重复的代码,我想找到一种更简洁的方法来访问这样的属性。
我知道我可以定义一个变量 var operations = $scope.operations
并在我需要这个值时访问 属性 operations.isEditOpen
但是,我仍然想要更简单的东西,因为我不' 想要为范围内的所有对象创建变量。
有没有什么方法可以用两个 params
(objectFromScope, neededProperty
) 创建一个 function
,它可以 return 来自变量的所需 属性 值是在范围内设置的吗?或者,当我想从作用域访问对象 属性 时,有没有更好的方法可以不用这么多代码?
PS:我也可以这样做:
let editingLine = $scope.operations.editingLine;
let isNewLine = $scope.operations.isNewLine;
let isEditOpen = $scope.operations.isEditOpen;
$scope.modify = function (invoiceLine) {
if (isEditOpen) return;
let originalLine = invoiceLines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
editingLine[invoiceLine.id] = true;
isEditOpen = true;
};
但这是一个好方法吗?
Is there any way to create a function with two params
( objectFromScope, neededProperty )
that can return the required property value from a variable which is set on the scope? Or is there any better way to do not have such much code when I want to access an object property from the scope?
是的,但我看不出它如何为您省去任何麻烦。它还会使切换到 TypeScript 变得更加困难(尽管如果您不想取消引用整个 属性 路径,可以使它与 keyof
一起工作)。
但这是那个函数:
function getPropertyValue( objectFromScope, neededProperty ) {
const pathComponents = neededProperty.split( '.' );
let obj = objectFromScope;
for( const component of pathComponents ) {
obj = obj[ component ];
}
return obj;
}
用法:
$scope.invoice = new Invoice();
$scope.operations = {
editingLine: {},
isNewLine: false,
isEditOpen: false
};
$scope.modify = function( invoiceLine ) {
if ($scope.operations.isEditOpen) return;
const lines = getPropertyValue( $scope, 'invoice.invoiceLines' );
let originalLine = lines.find(line => line.id = invoiceLine.id);
tempLine = angular.copy(originalLine);
$scope.operations.editingLine[invoiceLine.id] = true;
$scope.operations.isEditOpen = true;
};
...但这并不能使您的代码更易于阅读或维护。相反,它使情况变得更糟,因为以这种方式做事对于 JavaScript 和 AngularJS 来说是非常不惯用的:在这个项目上工作的任何其他人都会盯着代码看几分钟然后挠头,然后才想知道首先大声说出你为什么要这样做。