[angularjs] AngularJs에서 동적 범위 변수 설정-scope. <some_string>
나는 routeParam
지시어 속성 등에서 얻은 문자열을 가지고 있으며 이것을 기반으로 범위에 변수를 만들고 싶습니다. 그래서:
$scope.<the_string> = "something".
그러나 문자열에 하나 이상의 점이 포함 된 경우이를 분할하고 실제로 범위로 “드릴 다운”하고 싶습니다. 그래서 'foo.bar'
이되어야 $scope.foo.bar
. 이것은 단순 버전이 작동하지 않음을 의미합니다!
// This will not work as assigning variables like this will not "drill down"
// It will assign to a variables named the exact string, dots and all.
var the_string = 'life.meaning';
$scope[the_string] = 42;
console.log($scope.life.meaning); // <-- Nope! This is undefined.
console.log($scope['life.meaning']); // <-- It is in here instead!
문자열을 기반으로 변수를 읽을 때를 수행하여이 동작을 얻을 수 $scope.$eval(the_string)
있지만 값을 할당 할 때 어떻게 수행합니까?
답변
내가 찾은 해결책은 $ parse 를 사용하는 것 입니다.
“Angular 표현식을 함수로 변환합니다.”
더 나은 사람이 있다면 질문에 새로운 답변을 추가하십시오!
다음은 그 예입니다.
var the_string = 'life.meaning';
// Get the model
var model = $parse(the_string);
// Assigns a value to it
model.assign($scope, 42);
// Apply it to the scope
// $scope.$apply(); <- According to comments, this is no longer needed
console.log($scope.life.meaning); // logs 42
답변
Erik의 대답을 시작점으로 사용합니다. 저에게 효과가있는 더 간단한 솔루션을 찾았습니다.
내 ng-click 기능에는 다음이 있습니다.
var the_string = 'lifeMeaning';
if ($scope[the_string] === undefined) {
//Valid in my application for first usage
$scope[the_string] = true;
} else {
$scope[the_string] = !$scope[the_string];
}
//$scope.$apply
$ scope. $ apply를 사용하거나 사용하지 않고 테스트했습니다. 그것 없이는 올바르게 작동합니다!
답변
결과에서 동적 각도 변수 생성
angular.forEach(results, function (value, key) {
if (key != null) {
$parse(key).assign($scope, value);
}
});
추신. $ parse 속성을 컨트롤러의 함수에 전달하는 것을 잊지 마십시오
답변
Lodash를 사용해도 괜찮다면 _.set ()을 사용하여 한 줄에 원하는 것을 할 수 있습니다.
_.set (object, path, value) 객체의 경로 속성 값을 설정합니다. 경로의 일부가 존재하지 않으면 생성됩니다.
따라서 귀하의 예는 다음과 같습니다. _.set($scope, the_string, something);
답변
이미 주어진 답변에 추가하기 위해 다음이 저에게 효과적이었습니다.
HTML :
<div id="div{{$index+1}}" data-ng-show="val{{$index}}">
$index
루프 인덱스는 어디에 있습니까 ?
자바 스크립트 (여기서는 value
함수에 전달 된 매개 변수 $index
이며 현재 루프 색인 의 값이됩니다 ) :
var variable = "val"+value;
if ($scope[variable] === undefined)
{
$scope[variable] = true;
}else {
$scope[variable] = !$scope[variable];
}
답변
명심하세요 : 이것은 JavaScript 일 뿐이며 Angular JS와는 아무 관련이 없습니다. 따라서 마법의 ‘$’기호에 대해 혼동하지 마십시오.)
주요 문제는 이것이 계층 구조라는 것입니다.
console.log($scope.life.meaning); // <-- Nope! This is undefined.
=> a.b.c
“$ scope.life”는 존재하지 않지만 위의 용어는 “의미”를 해결하기를 원하기 때문에 정의되지 않았습니다.
해결책은
var the_string = 'lifeMeaning';
$scope[the_string] = 42;
console.log($scope.lifeMeaning);
console.log($scope['lifeMeaning']);
또는 조금 더 efford로.
var the_string_level_one = 'life';
var the_string_level_two = the_string_level_one + '.meaning';
$scope[the_string_level_two ] = 42;
console.log($scope.life.meaning);
console.log($scope['the_string_level_two ']);
다음을 사용하여 구조적 객체에 액세스 할 수 있으므로
var a = {};
a.b = "ab";
console.log(a.b === a['b']);
이것에 대한 몇 가지 좋은 튜토리얼이 있습니다.이 튜토리얼은 JavaScript의 재미를 잘 안내합니다.
에 대해 뭔가가
$scope.$apply();
do...somthing...bla...bla
웹에서 ‘angular $ apply’를 검색하면 $ apply 기능에 대한 정보를 찾을 수 있습니다. 그리고 당신은 더 현명하게 사용해야합니다 ($ apply 단계가없는 경우).
$scope.$apply(function (){
do...somthing...bla...bla
})
답변
아래 Lodash 라이브러리를 사용하는 경우 각도 범위에서 동적 변수를 설정하는 방법이 있습니다.
각도 범위에서 값을 설정합니다.
_.set($scope, the_string, 'life.meaning')
각도 범위에서 값을 가져옵니다.
_.get($scope, 'life.meaning')